.caption,.field-help,small{
  color:#52645b}
.sidebar small,.sidebar .eyebrow{
  color:#b9d1c1}
.skip-link{
  position:fixed;
  left:16px;
  top:-100px;
  z-index:999;
  background:#fff;
  color:#123c35;
  padding:var(--space-3) 20px;
  border:2px solid #123c35}
.skip-link:focus{
  top:12px}
.mobile-menu{
  display:none}
.form-error{
  position:relative;
  margin:16px 0;
  outline:2px solid transparent}
.form-error:focus{
  outline:2px solid #7c3020;
  outline-offset:3px}
.target-context{
  border-left:4px solid #255b47;
  padding:var(--space-3) 16px;
  background:#edf2e7;
  margin-bottom:18px}
.target-context small,td small{
  display:block;
  overflow-wrap:anywhere;
  margin-top:6px}
.review-notice summary,details summary{
  cursor:pointer;
  line-height:1.55}
.review-notice p{
  margin:8px 0}
.risk-details{
  padding:var(--space-4);
  border:1px solid #d6ded4;
  border-radius:var(--radius-panel)}
.risk-details[open]{
  display:grid;
  gap:14px}
.risk-details summary{
  font-weight:600}
.current-plan{
  outline:3px solid #255b47}
.observation{
  border-top:1px solid #d6ded4;
  padding:var(--space-3) 0}
.next-step{
  display:block;
  margin-top:12px;
  white-space:normal}
.admin-tabs{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-bottom:20px}
.list-search{
  display:block;
  max-width:640px;
  margin-bottom:18px}
.landing-help{
  padding:60px 24px;
  background:#edf2e7}
.landing-help .container{
  max-width:1100px;
  margin:auto}
.landing-help details{
  max-width:800px}
pre{
  white-space:pre-wrap;
  overflow-wrap:anywhere;
  font:13px/1.55 ui-monospace,monospace}
.draft-note{
  display:block;
  padding:4px 12px}
.table-wrap td{
  max-width:360px;
  overflow-wrap:anywhere}
dialog{
  max-height:90dvh;
  overflow:auto}
button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible,summary:focus-visible{
  outline:3px solid #34775c;
  outline-offset:3px}
#toast.error{
  z-index:var(--layer-toast);
  padding-right:30px}
.table-editor label{
  min-width:0!important}
.waitlist-receipt{
  margin:16px 0}




.sidebar .ghost{
  color:#b9d1c1}
.sidebar .ghost:hover{
  color:#fff}

/* Shared foundations keep long names and references inside their containers. */
[hidden]{display:none!important}
.mobile-header,.mobile-navigation{display:none}
.shell{grid-template-columns:228px minmax(0,1fr)}
.grid>*{min-width:0}
.card-header,.usage-line{flex-wrap:wrap}
.card-header>*,.row-link>*,.row-link .left>*{min-width:0}
.card-header h2,.card-header h3,.row-link strong,.row-link small,
.target-context,.notice,.outbox-preview,.navigation-account{overflow-wrap:anywhere}
.tag{max-width:100%;white-space:normal;line-height:1.4}
.tag .dot{flex-shrink:0}
.table-wrap{max-width:100%;overscroll-behavior-x:contain}
.table-wrap:focus-visible{outline:3px solid #34775c;outline-offset:4px}
.table-wrap td{white-space:normal}
.row-link>button,.row-link>a.button{flex-shrink:0;white-space:normal}
.modal-header{gap:16px;align-items:flex-start}
.modal-header h2{min-width:0;overflow-wrap:anywhere}
.modal-header>button{flex-shrink:0}

@media(max-width:1080px){
  .shell{grid-template-columns:195px minmax(0,1fr)}
}

/* Use the same compact navigation on phones and portrait tablets. */
@media(max-width:900px){
  input,textarea,select{font-size:16px}
  button,button.small,button.ghost,.button,summary{min-height:44px}
  .shell{display:block;min-height:100dvh}
  .shell>.sidebar,.mentor-workspace .sidebar{display:none}
  .mobile-header{
    display:flex;align-items:center;justify-content:space-between;gap:12px;
    position:sticky;top:0;z-index:30;background:var(--green);color:#fff;
    padding:10px max(16px,env(safe-area-inset-right)) 10px max(16px,env(safe-area-inset-left));
    padding-top:max(10px,env(safe-area-inset-top));
    box-shadow:0 2px 12px #123c3515;
  }
  .mobile-header .brandmark{background:var(--leaf);color:var(--green)}
  .mobile-header .brand{font-size:19px;white-space:nowrap}
  .mobile-header .mobile-menu{
    display:inline-flex;margin:0;width:auto;min-height:44px;
    padding:10px 14px;background:#ffffff17;color:#fff;border:1px solid #ffffff30;
  }
  .menu-icon{font-size:20px;line-height:1}
  .mobile-navigation[open]{
    display:flex;flex-direction:column;gap:20px;
    position:fixed;inset:0 0 0 auto;margin:0;
    width:min(360px,calc(100% - 24px));max-width:none;
    height:100dvh;max-height:100dvh;border-radius:20px 0 0 20px;
    padding:20px max(20px,env(safe-area-inset-right)) max(20px,env(safe-area-inset-bottom)) 20px;
    padding-top:max(20px,env(safe-area-inset-top));
    background:var(--green);color:#e7efe2;overflow-y:auto;
  }
  html:has(.mobile-navigation[open]){overflow:hidden}
  .navigation-heading{display:flex;align-items:center;justify-content:space-between;gap:12px}
  .navigation-heading h2{font-size:22px;margin:0}
  .navigation-heading button.ghost{color:#fff;font-size:28px;padding:0;width:44px;height:44px}
  .navigation-account{display:grid;gap:6px;border-bottom:1px solid #ffffff24;padding-bottom:20px}
  .navigation-account small{color:#b9d1c1;font-size:14px}
  .navigation-account>span{font-size:13px;color:#b9d1c1}
  .mobile-navigation nav{display:grid;gap:6px}
  .mobile-navigation .nav-item{
    width:100%;min-height:48px;justify-content:flex-start;text-align:left;
    background:transparent;color:#d6e6d8;font-size:16px;padding:12px;
  }
  .mobile-navigation .nav-item.active{background:#ffffff18;color:#fff;font-weight:600}
  .mobile-navigation .bottom{margin-top:auto;display:grid;gap:8px;border-top:1px solid #ffffff24;padding-top:16px}
  .mobile-navigation .bottom .ghost{justify-content:flex-start;color:#b9d1c1;min-height:44px}
  .mobile-navigation .logout{margin:0}
  .topbar,.mentor-workspace .topbar{height:auto;min-height:44px;padding:8px 20px;gap:12px}
  .topbar .right{display:none}
  .crumb{min-width:0;overflow-wrap:anywhere;font-size:13px}
  .page,.mentor-workspace .page{padding:24px 20px 32px}
  .page-heading{margin-bottom:24px;gap:16px}
  .page-heading h1{font-size:28px;line-height:1.2;letter-spacing:-.8px}
  .grid.two,.grid.equal,.grid.three{grid-template-columns:minmax(0,1fr)}
  .chat-layout{display:block}
  .conversation-history{margin-bottom:12px}
  .conversation-history>summary{display:list-item}
  .conversation-list{display:grid;gap:4px;margin:0;overflow:visible}
  .conversation-choice{min-width:0;white-space:normal;overflow-wrap:anywhere}
  .chat-panel{height:clamp(300px,calc(100dvh - 315px),720px)}
}

@media(max-width:760px){
  body{font-size:16px;line-height:1.5}
  input,textarea,select{font-size:16px;min-height:48px}
  input[type=checkbox]{min-height:22px;width:22px;margin:0;accent-color:var(--green)}
  label.check{gap:10px;align-items:center;min-height:44px}
  button,button.small,button.ghost,.button,summary{min-height:44px;max-width:100%}
  button,.button{white-space:normal;text-align:center;line-height:1.4}
  .brandmark{flex-shrink:0}
  .site-nav{flex-wrap:wrap;gap:12px}
  .site-nav nav>a:not(.button){display:inline-flex;align-items:center;min-height:44px}
  .site-nav nav{width:100%;justify-content:space-between;gap:12px;font-size:14px}
  .hero .actions .button{width:100%}
  .hero p{font-size:16px}
  .hero small{display:block;font-size:14px;line-height:1.6}
  .landing-help{padding:40px 20px}
  .feature{padding:24px}
  .feature p,.waitlist p,.section-intro p{font-size:15px}
  .auth-page{min-height:100dvh}
  .auth-story{min-height:0;padding:24px;gap:16px}
  .auth-story h1{font-size:28px;margin:8px 0 0}
  .auth-story p{margin:0;font-size:14px}
  .auth-form{padding:28px 24px;max-width:520px;align-self:start}
  .auth-form h2{font-size:28px;margin-top:0}
  .auth-form>p{font-size:15px;overflow-wrap:anywhere}
  .auth-form form{margin-top:24px}
  .page,.mentor-workspace .page{padding:24px 16px max(32px,env(safe-area-inset-bottom))}
  .page,.mentor-workspace .page{padding-left:max(16px,env(safe-area-inset-left));padding-right:max(16px,env(safe-area-inset-right))}
  .page-heading>div{width:100%;min-width:0}
  .page-heading p,.card>p{font-size:15px}
  .page-heading>button{width:100%;white-space:normal}
  .card{padding:20px;border-radius:16px}
  .card-header{align-items:flex-start;gap:12px}
  .card-header h2,.card-header h3{flex:1 1 140px;line-height:1.4}
  .grid{gap:16px}
  .stats{gap:12px}
  .stat{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px 12px;padding:16px}
  .stat strong{font-size:22px;text-align:right;overflow-wrap:anywhere}
  .stat .caption{font-size:14px}
  .stat small{grid-column:1/-1;max-width:none;font-size:13px}
  .row-link{flex-wrap:wrap;gap:12px;align-items:flex-start}
  .row-link>div{flex:1 1 180px}
  .row-link>strong,.row-link>span:not(.round){flex:1 1 100%}
  .row-link strong{font-size:15px}
  .row-link small{font-size:13px;line-height:1.6}
  .row-link .left{min-width:0}
  .usage-line{gap:6px 12px;font-size:13px;line-height:1.6}
  .usage-line>span:last-child{text-align:left}
  .admin-tabs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .admin-tabs button{width:100%}
  .inline-actions>button,.commitment .actions>button{flex:1 1 150px}
  .commitment{padding-left:14px;overflow-wrap:anywhere}
  .commitment p{font-size:15px}
  dialog:not(.mobile-navigation){
    width:calc(100% - 24px);max-height:calc(100dvh - 24px);margin:auto;
    padding:20px;border-radius:16px;scroll-padding:20px;
  }
  .modal-header{position:sticky;top:-20px;background:#fff;z-index:1;padding:12px 0;margin:-12px 0 16px}
  .modal-header h2{font-size:22px;line-height:1.35}
  .modal-header>button{width:44px;height:44px;padding:0;font-size:26px}
  .modal-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .modal-actions>button:only-child{grid-column:1/-1}
  .modal-actions>button{width:100%}
  dialog form>button.primary{width:100%}
  .table-editor{overflow:visible;padding:12px}
  .table-editor .record{display:grid;grid-template-columns:minmax(0,1fr);gap:12px;border-bottom:1px solid var(--line);padding-bottom:16px}
  .table-editor label{min-width:0!important;margin:0}
  .table-editor input,.table-editor select{width:100%;min-width:0}
  .table-editor .record>button{justify-self:end;width:44px}
  .chat-header{flex-wrap:wrap;padding:16px;gap:8px}
  .chat-header h2{flex:1 1 130px}
  .chat-header button{max-width:100%;min-height:44px;font-size:13px}
  .chat-composer{padding:12px;padding-bottom:max(12px,env(safe-area-inset-bottom));gap:8px}
  .chat-composer button{min-width:76px;padding:12px;height:auto}
  .chat-composer textarea{min-height:64px}
  .message .bubble{font-size:15px;max-width:100%}
  .message .bubble button{white-space:normal;text-align:left}
  #toast{width:calc(100% - 32px);max-width:520px;bottom:max(16px,env(safe-area-inset-bottom));overflow-wrap:anywhere}
}

@media(max-width:360px){
  .card{padding:16px}
  .page-heading h1{font-size:26px}
  .table-wrap tr{padding:12px}
  .chat-header h2{flex-basis:100%}
  .chat-header button{width:100%}
}

@media(max-width:900px){
  .table-wrap{overflow:visible}
  .table-wrap table{display:block;width:100%;min-width:0;white-space:normal;font-size:15px}
  .table-wrap thead{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
  .table-wrap tbody{display:grid;gap:16px;width:100%}
  .table-wrap tr{display:block;width:100%;padding:16px;background:#f8faf5;border:1px solid var(--line);border-radius:12px}
  .table-wrap td,.table-wrap td.wrap{
    display:block;width:100%;min-width:0;max-width:none;
    white-space:normal;overflow-wrap:anywhere;padding:10px 0;border:0;
  }
  .table-wrap td:first-child{padding-top:0}
  .table-wrap td:last-child{padding-bottom:0}
  .table-wrap td+td{border-top:1px solid #e3e9de}
  .table-wrap td::before{content:attr(data-label);display:block;font-size:12px;font-weight:600;color:var(--muted);margin-bottom:4px;letter-spacing:.2px}
  .table-wrap td:empty{display:none}
  .table-wrap td .tag{font-size:13px;padding:6px 10px}
  .table-wrap td button,.table-wrap td a.button{width:100%;margin-top:8px}
  .table-wrap .inline-actions{display:grid;width:100%;gap:8px}
  .table-wrap .inline-actions button{margin:0}
  .table-wrap td small{font-size:13px;line-height:1.6}
  .table-wrap td small>br:first-child{display:none}
  .account-actions{min-width:0;width:100%;margin-top:12px}
  .account-actions .field-help{max-width:none}
  .account-actions .inline-actions{grid-template-columns:minmax(0,1fr)}
}