/* Supporting routes share SkillMap's shell and tokens without changing their data or actions. */
.sf-support-shell{--ink:#0b204d;--text:#29446f;--muted:#526a92;--line:#dce7f6;--bg:#fff;--paper:#fff;--accent:#dcecff;--green:#0060ca;--green-bg:#eaf8ef;--amber:#85580e;--amber-bg:#fff4dc;--lav:#634a91;--lav-bg:#f2edfc;--gray:#edf2f8;--radius:14px;--shadow:0 8px 24px #12376808;display:grid;grid-template-columns:201px minmax(0,1fr);min-height:100vh;background:#fff;color:var(--text);font:14px/1.6 Arial,'Segoe UI',sans-serif}
.sf-support-shell :is(button,a,input,select,textarea,summary):focus-visible{outline:3px solid #0074ed;outline-offset:3px}
.sf-support-shell :is(button,a){touch-action:manipulation}
.sf-support-shell [hidden]{display:none!important}
.sf-support-shell .sf-support-sidebar{position:sticky;top:0;display:flex;flex-direction:column;min-width:0;height:100vh;overflow-y:auto;scrollbar-width:thin;padding:0 12px 24px;background:linear-gradient(110deg,#f4faff,#f7fbff);border-right:1px solid #e4efff}
.sf-support-shell .sf-support-brand{display:flex;align-items:center;gap:9px;min-height:66px;padding:0 10px;margin-bottom:20px;text-decoration:none;color:#081849}
.sf-support-shell .sf-support-brand strong{font-size:20px;line-height:1.2;letter-spacing:-.6px;font-weight:700;white-space:nowrap}
.sf-support-shell .sf-support-nav-label{padding:0 12px;margin-bottom:10px;font-size:10px;line-height:1.5;font-weight:600;letter-spacing:.8px;text-transform:uppercase;color:#657da1}
.sf-support-shell .sf-support-nav{display:grid;gap:6px}
.sf-support-shell :is(.sf-support-nav,.sf-support-sidebar-bottom) button{display:flex;align-items:center;gap:12px;min-height:44px;width:100%;padding:10px 12px;border:0;border-radius:9px;background:transparent;color:#3e5886;font-size:13px;line-height:1.5;text-align:left}
.sf-support-shell :is(.sf-support-nav,.sf-support-sidebar-bottom) button svg{width:22px;height:22px;flex:none;color:#0054ba}
.sf-support-shell .sf-support-nav button.active{background:#dcecff;color:#00459e;font-weight:600}
.sf-support-shell :is(.sf-support-nav,.sf-support-sidebar-bottom) button:hover:not(:disabled){background:#e7f2ff;color:#00459e}
.sf-support-shell .sf-support-sidebar-bottom{display:grid;gap:6px;margin-top:auto;padding-top:32px}
.sf-support-shell .sf-support-sidebar-bottom button:disabled{opacity:.6}
.sf-support-shell .sf-support-main-shell{min-width:0}
.sf-support-shell .sf-support-topbar{display:flex;align-items:center;justify-content:space-between;gap:24px;min-height:66px;padding:10px 32px;background:linear-gradient(110deg,#edf7ff,#d5edff 80%,#edf7ff);border-bottom:1px solid #dcecff}
.sf-support-shell .sf-support-breadcrumb{display:flex;align-items:center;gap:11px;min-width:0;font-size:12px;line-height:1.5;color:#506895}
.sf-support-shell .sf-support-breadcrumb button{padding:6px 0;border:0;background:none;color:#0059bf;font-size:inherit;white-space:nowrap}
.sf-support-shell .sf-support-breadcrumb button:hover{text-decoration:underline}
.sf-support-shell .sf-support-breadcrumb [aria-current]{min-width:0;color:#1b3b69;font-weight:600}
.sf-support-shell .sf-support-user{display:flex;align-items:center;gap:10px;flex:none;color:#1b3b69;font-size:12px;white-space:nowrap}
.sf-support-shell .sf-support-user .hp-mini-avatar{width:36px;height:36px;flex:none;box-shadow:0 0 0 2px #fff}
.sf-support-shell .sf-support-main{min-width:0;width:100%;max-width:1360px;margin:0 auto;padding:30px 32px 24px}
.sf-support-shell .sf-support-footer{display:flex;flex-direction:column;gap:10px;margin-top:36px;padding-top:20px;border-top:1px solid var(--line);color:#607397;font-size:11px;line-height:1.6}
.sf-support-shell .sf-support-footer nav{display:flex;flex-wrap:wrap;gap:3px 18px}
.sf-support-shell .sf-support-footer button{min-height:32px;padding:4px 0;border:0;background:none;color:#45618e;font-size:11px;line-height:1.5}
.sf-support-shell .sf-support-footer button:hover{color:#0059bf;text-decoration:underline}

/* Existing page components keep their meaning, with a consistent reading scale. */
.sf-support-page{min-width:0}
.sf-support-page :is(.hero,.page-heading,.product-heading){align-items:flex-start;gap:20px;margin-bottom:26px}
.sf-support-page :is(.hero,.page-heading,.product-heading) h1{font-size:32px;line-height:1.2;letter-spacing:-.85px;font-weight:600}
.sf-support-page .hero-copy{max-width:780px}
.sf-support-page :is(.hero,.page-heading,.product-heading) p{max-width:780px;margin-top:11px;color:var(--muted);font-size:14px;line-height:1.7}
.sf-support-page .eyebrow{color:#0060ca;font-size:10px;letter-spacing:1px;margin-bottom:10px}
.sf-support-page .context-link{display:inline-flex;align-items:center;min-height:36px;padding:3px 0;margin-bottom:8px;background:none;border:0;color:#0060ca;font-size:12px;text-align:left}
.sf-support-page .context-link:hover{text-decoration:underline}
.sf-support-page :is(.panel,.detail-card,.data-panel,.metric,.criterion-card){border-color:var(--line);border-radius:14px;background:#fff;box-shadow:0 3px 12px #12376804}
.sf-support-page :is(.panel,.detail-card){padding:24px}
.sf-support-page :is(.panel,.detail-card) h2{font-size:20px;line-height:1.4;letter-spacing:-.4px}
.sf-support-page :is(.panel,.detail-card) h3{font-size:17px;line-height:1.45;letter-spacing:-.25px}
.sf-support-page :is(.panel,.detail-card) p{font-size:13px;line-height:1.75}
.sf-support-page :is(.small-label,.tiny,.help){line-height:1.6}
.sf-support-page .small-label{font-size:10px;letter-spacing:.75px}
.sf-support-page .help{font-size:12px;color:var(--muted)}
.sf-support-page .section-space{margin-top:24px}
.sf-support-page .section-head{align-items:center}
.sf-support-page .section-head h2{font-size:21px;line-height:1.4}
.sf-support-page .btn{min-height:40px;max-width:100%;padding:9px 14px;border-color:#cddff5;background:#fff;color:#14529c;font-size:13px;line-height:1.5;font-weight:500;white-space:normal;text-align:center}
.sf-support-page .btn:hover:not(:disabled){background:#eff6ff;border-color:#a6caf5;color:#0056bd}
.sf-support-page .btn-primary{background:#0064df;border-color:#0064df;color:#fff}
.sf-support-page .btn-primary:hover:not(:disabled){background:#0054bd;border-color:#0054bd;color:#fff}
.sf-support-page .btn-accent{background:#e6f2ff;border-color:#cddff5;color:#0056bd}
.sf-support-page .btn-quiet{background:transparent;border-color:transparent}
.sf-support-page .btn-small{font-size:12px}
.sf-support-page .badge{border-radius:6px;padding:5px 9px;line-height:1.5}
.sf-support-page :is(.badge.met,.badge.work){background:#eaf8ef;color:#246345}
.sf-support-page :is(.badge.unknown,.badge.signal,.badge.pending){background:#edf2f8;color:#506581}
.sf-support-page .verification-badge.unknown{background:#edf2f8;border-color:#dde6f1;color:#526782}
.sf-support-page :is(.notice,.proof-scope,.compact-notice){background:#f2f7fe;border:1px solid #e0ebf8;border-radius:10px;color:#46638b;font-size:12px;line-height:1.7}
.sf-support-page .notice{padding:15px 18px}
.sf-support-page .proof-scope{padding:15px 17px;margin:20px 0}
.sf-support-page .compact-notice{padding:15px 18px}
.sf-support-page .data-panel>.compact-notice{border:0;border-top:1px solid var(--line);border-radius:0;padding:15px 22px}
.sf-support-page :is(.quote-panel,.example-line){background:#f4f8fe;border-color:#9ec4f3;color:var(--text)}
.sf-support-page .quote-panel{border-left-width:3px;border-radius:0 9px 9px 0;padding:18px;line-height:1.75}
.sf-support-page :is(.signal-line,.finding,.history,.time-row,.requirement-row){border-color:var(--line)}
.sf-support-page :is(.signal-number,.criterion-number,.queue-icon){background:#e9f3ff;color:#0964c7}
.sf-support-page .signal-number{min-width:28px;height:28px;border-radius:8px}
.sf-support-page .criterion-number{width:34px;height:34px;border-radius:9px;font-weight:600}
.sf-support-page .avatar.devon{background:#e4f1ff;color:#1262bd}

/* Evidence and the earlier review forms. */
.sf-support-page .devon-record-summary{gap:10px;margin-bottom:24px}
.sf-support-page .data-panel-head{padding:21px 24px;border-color:var(--line)}
.sf-support-page .data-panel-head h2{font-size:19px;line-height:1.45}
.sf-support-page .data-panel-head p{font-size:13px;line-height:1.65}
.sf-support-page .review-queue-row{display:grid;grid-template-columns:44px minmax(0,1fr) auto auto;gap:18px;padding:22px 24px;border-color:var(--line)}
.sf-support-page .review-queue-row h3{font-size:16px;line-height:1.5}
.sf-support-page .review-queue-row p{font-size:12px;line-height:1.65}
.sf-support-page .review-queue-row>.btn{font-size:12px}
.sf-support-page .review-queue-row>.badge{font-size:11px}
.sf-support-page .devon-earlier-evidence>summary{padding:20px 24px;font-size:14px}
.sf-support-page .case-tabs{gap:7px;margin-bottom:22px;flex-wrap:wrap}
.sf-support-page .case-tabs button{min-height:42px;border-color:#d5e4f6;background:#f5f9ff;color:#45658f;line-height:1.5}
.sf-support-page .case-tabs button.active{background:#0064df;border-color:#0064df;color:#fff}
.sf-support-page .case-tabs button:hover:not(.active){background:#e9f3ff}
.sf-support-page .review-layout{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
.sf-support-page .status-head{align-items:flex-start;flex-wrap:wrap;gap:10px}
.sf-support-page .review-notice{background:#f2edfc;color:#634a91;font-size:12px;line-height:1.7}
.sf-support-page .finding-head h4{font-size:14px;line-height:1.5}
.sf-support-page .finding blockquote{border-color:#c9def8;color:#49678f;line-height:1.7}
.sf-support-page :is(input,textarea,select){min-width:0;max-width:100%;border-color:#cbdcf0;accent-color:#0064df;background-color:#fff;color:var(--text)}
.sf-support-page :is(.response-area,.finding textarea,.reviewer-input){font-size:13px;line-height:1.65}
.sf-support-page :is(.reviewer-input,.finding select){min-height:42px}
.sf-support-page .finding textarea{min-height:86px;padding:11px 12px;border-radius:8px}
.sf-support-page .response-area{background:#fbfdff}
.sf-support-page .input-label{font-size:12px;color:var(--ink)}
.sf-support-page .review-actions{gap:10px;align-items:stretch}
.sf-support-page .history{font-size:12px;line-height:1.7}

/* Work requirements and supporting context pages. */
.sf-support-page .devon-work-summary{gap:20px;margin:24px 0}
.sf-support-page .devon-work-summary .detail-card h2{font-size:20px}
.sf-support-page .devon-work-summary .detail-card p{font-size:13px}
.sf-support-page .requirement-row{grid-template-columns:minmax(0,1.3fr) minmax(180px,1fr);gap:18px;padding:18px 0}
.sf-support-page .requirement-row :is(b,strong){font-size:14px}
.sf-support-page .requirement-row small{font-size:12px;line-height:1.6}
.sf-support-page .metric-grid{gap:16px;margin:24px 0}
.sf-support-page .metric{padding:22px}
.sf-support-page .metric strong{font-size:30px;font-weight:600;color:#0b3c79;margin:12px 0 8px}
.sf-support-page .metric p{font-size:12px;line-height:1.6}
.sf-support-page .task-strip{background:linear-gradient(110deg,#075ec6,#074b9f);border-radius:14px;padding:24px;gap:24px}
.sf-support-page .task-strip .small-label{color:#d4e7ff}
.sf-support-page .task-strip h2{font-size:22px;line-height:1.35;color:#fff}
.sf-support-page .task-strip p{color:#deecff;line-height:1.65}
.sf-support-page .task-strip .btn{background:#fff;border-color:#fff;color:#0055b8;flex:none}
.sf-support-page .task-strip .btn:hover{background:#edf6ff;color:#00499f}
.sf-support-page .time-row{font-size:13px;line-height:1.7}
.sf-support-page .time-row b{white-space:normal;max-width:58%;overflow-wrap:anywhere}
.sf-support-page .time-row.total{background:#eef6ff;color:#174f93;border-radius:8px}
.sf-support-page .four-rs article{border-top-color:#9cc8fb;background:#f1f7ff;border-radius:0 0 10px 10px}
.sf-support-page .four-rs p{font-size:13px;line-height:1.65}
.sf-support-page .wide-path{background:#eff6ff;color:#496b97;border:1px solid #dfebfa}
.sf-support-page .path-node{background:#fff;border:1px solid #dce8f7;color:#375d8b}
.sf-support-page .criterion-card{grid-template-columns:36px minmax(0,1fr) minmax(190px,.7fr);padding:24px;gap:18px}
.sf-support-page .criterion-card h3{font-size:18px;line-height:1.45}
.sf-support-page .criterion-card p{font-size:13px;line-height:1.75}
.sf-support-page .source-cell{border-color:var(--line)}
.sf-support-page .example-line{padding:12px 14px;font-size:12px;line-height:1.75}
.sf-support-page .level-number{font-size:32px;font-weight:500;color:#4794eb}
.sf-support-page .plain-list{font-size:13px;line-height:1.75;gap:12px}
.sf-support-page .build-flow p{font-size:13px;line-height:1.7}
.sf-support-page .next-step{margin-top:28px}

/* The shared dialog is a sibling of the screen, so inherit this palette explicitly. */
body:has(.sf-support-shell) #detail-dialog{--ink:#0b204d;--text:#29446f;--muted:#526a92;--line:#dce7f6;--accent:#dcecff;--green:#0060ca;--green-bg:#eaf8ef;--gray:#edf2f8;border-color:var(--line);border-radius:16px;color:var(--text);font-family:Arial,'Segoe UI',sans-serif;box-shadow:0 24px 80px #15376630}
body:has(.sf-support-shell) #detail-dialog .btn{min-height:40px;border-color:#cddff5;color:#14529c;white-space:normal}
body:has(.sf-support-shell) #detail-dialog .btn:hover{background:#eff6ff;color:#0058bf}
body:has(.sf-support-shell) #detail-dialog .btn-primary{background:#0064df;border-color:#0064df;color:#fff}
body:has(.sf-support-shell) #detail-dialog .btn-primary:hover{background:#0054bd;color:#fff}
body:has(.sf-support-shell) #detail-dialog :is(button,a,input,textarea,select,summary):focus-visible{outline:3px solid #0074ed;outline-offset:3px}
body:has(.sf-support-shell) #detail-dialog :is(.quote-panel,.proof-scope,.as-transcript,.wide-path,.example-line){background:#f3f8ff;border-color:#d3e3f8;color:#375985}
body:has(.sf-support-shell) #detail-dialog .notice{background:#f2f7fe;border-color:#e0ebf8;color:#46638b}
body:has(.sf-support-shell) #detail-dialog :is(.criterion-number,.signal-number,.step-number){background:#e9f3ff;border-color:#d3e3f8;color:#0964c7}
body:has(.sf-support-shell) #detail-dialog .path-node{background:#fff;border:1px solid #dce8f7;color:#375d8b}
body:has(.sf-support-shell) #detail-dialog :is(input,textarea,select){border-color:#cbdcf0;background-color:#fff;accent-color:#0064df}
body:has(.sf-support-shell) #detail-dialog :is(.level-step,.source-card){border-color:#dce7f6;background:#fbfdff}
body:has(.sf-support-shell) #detail-dialog :is(.badge.met,.badge.work){background:#eaf8ef;color:#246345}
body:has(.sf-support-shell) #detail-dialog .dialog-body{font-size:14px;line-height:1.75}
body:has(.sf-support-shell) #toast{background:#153b70;color:#fff}

@media(max-width:1200px){
  .sf-support-page .review-queue-row{grid-template-columns:42px minmax(0,1fr) auto;gap:14px}
  .sf-support-page .review-queue-row>.btn{grid-column:2/-1;justify-self:start}
  .sf-support-page .metric-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .sf-support-page .metric-grid.three{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media(max-width:1100px){
  .sf-support-shell .sf-support-topbar{padding-right:24px;padding-left:24px}
  .sf-support-shell .sf-support-main{padding:26px 24px 24px}
  .sf-support-page .review-layout{grid-template-columns:minmax(0,1fr)}
  .sf-support-page .criterion-card{grid-template-columns:36px minmax(0,1fr)}
  .sf-support-page .source-cell{grid-column:2;border-left:0;border-top:1px solid var(--line);padding:14px 0 0}
  .sf-support-page .task-strip{align-items:flex-start;flex-direction:column;gap:16px}
}
@media(max-width:900px){
  .sf-support-page :is(.two-col,.standard-top,.devon-work-summary){grid-template-columns:minmax(0,1fr)}
  .sf-support-page .section-head{align-items:flex-start}
  .sf-support-page .level-grid{grid-template-columns:minmax(0,1fr)}
  .sf-support-page .metric-grid.three{grid-template-columns:minmax(0,1fr)}
}
@media(max-width:760px){
  .sf-support-shell{grid-template-columns:minmax(0,1fr)}
  .sf-support-shell .sf-support-sidebar{display:contents}
  .sf-support-shell .sf-support-brand{position:absolute;z-index:1;top:0;left:16px;min-height:66px;margin:0;padding:0;gap:7px}
  .sf-support-shell .sf-support-brand strong{font-size:19px}
  .sf-support-shell .sf-support-nav-label,.sf-support-shell .sf-support-sidebar-bottom{display:none}
  .sf-support-shell .sf-support-nav{grid-row:2;display:flex;gap:4px;max-width:100%;overflow-x:auto;padding:9px 14px;border-bottom:1px solid #e4efff;background:#f5faff;scrollbar-width:thin}
  .sf-support-shell .sf-support-nav button{width:auto;flex:none;min-height:42px;padding:9px 11px;font-size:12px;gap:8px}
  .sf-support-shell .sf-support-nav button svg{width:19px;height:19px}
  .sf-support-shell .sf-support-main-shell{display:contents}
  .sf-support-shell .sf-support-topbar{grid-row:1;min-height:66px;padding:10px 18px 10px 185px;justify-content:flex-end}
  .sf-support-shell .sf-support-breadcrumb{display:none}
  .sf-support-shell .sf-support-main{grid-row:3;padding:24px 20px}
  .sf-support-page :is(.hero,.page-heading,.product-heading) h1{font-size:28px;letter-spacing:-.6px}
  .sf-support-page :is(.hero,.page-heading,.product-heading) p{font-size:13px}
  .sf-support-page .review-queue-row{grid-template-columns:36px minmax(0,1fr);gap:10px 13px;padding:20px}
  .sf-support-page .review-queue-row>.badge,.sf-support-page .review-queue-row>.verification-badge{grid-column:2;justify-self:start}
  .sf-support-page .review-queue-row>.btn{grid-column:2;justify-self:start}
  .sf-support-page .review-queue-row .queue-icon{width:36px;height:36px}
}
@media(max-width:560px){
  .sf-support-shell .sf-support-user>span:last-child{display:none}
  .sf-support-shell .sf-support-main{padding:22px 16px}
  .sf-support-shell .sf-support-footer{margin-top:28px;font-size:10px}
  .sf-support-shell .sf-support-footer nav{gap:3px 14px}
  .sf-support-page :is(.panel,.detail-card){padding:19px}
  .sf-support-page :is(.hero,.page-heading,.product-heading){margin-bottom:22px}
  .sf-support-page :is(.panel,.detail-card) h2{font-size:19px}
  .sf-support-page .metric-grid{grid-template-columns:minmax(0,1fr);gap:12px}
  .sf-support-page .metric{padding:19px}
  .sf-support-page .metric strong{font-size:29px}
  .sf-support-page .metric .small-label{font-size:10px;letter-spacing:.75px}
  .sf-support-page .data-panel-head{padding:19px;flex-wrap:wrap;gap:12px}
  .sf-support-page .data-panel>.compact-notice{padding:14px 19px}
  .sf-support-page .devon-earlier-evidence>summary{padding:19px}
  .sf-support-page .case-tabs button{flex:1;white-space:normal;font-size:12px;padding:9px 11px}
  .sf-support-page .review-actions .btn{flex:1 1 150px;min-height:44px}
  .sf-support-page .requirement-row{grid-template-columns:minmax(0,1fr);gap:9px}
  .sf-support-page .requirement-row>div:first-child{grid-column:auto}
  .sf-support-page .criterion-card{padding:19px;gap:12px;grid-template-columns:30px minmax(0,1fr)}
  .sf-support-page .criterion-number{width:30px;height:30px}
  .sf-support-page .criterion-card h3{font-size:17px}
  .sf-support-page .source-cell{grid-column:1/-1}
  .sf-support-page .four-rs{grid-template-columns:minmax(0,1fr)}
  .sf-support-page .level-grid article{gap:15px}
  .sf-support-page .next-step .btn{width:100%;min-height:44px}
  body:has(.sf-support-shell) #detail-dialog .dialog-head{padding:20px;gap:12px}
  body:has(.sf-support-shell) #detail-dialog .dialog-head h2{font-size:20px;line-height:1.4}
  body:has(.sf-support-shell) #detail-dialog .dialog-body{padding:20px;font-size:13px}
}

/* Shared release feedback stays visible across all current demo shells. */
#save-error{padding:14px 18px;margin:0 0 20px;border:1px solid #e5be6a;border-radius:10px;background:#fff6df;color:#68430a;font-size:14px;line-height:1.55;overflow-wrap:anywhere}
#detail-dialog>#save-error{margin:20px 24px 0}
body:has(.hp-shell,.sa-shell,.sf-support-shell) #toast{background:#0b2449}
@media(max-width:680px){
  :is(.hp-shell,.sa-shell,.sf-support-shell) :is(input,textarea,select):not([type=checkbox],[type=radio]),
  body:has(.hp-shell,.sa-shell,.sf-support-shell) #detail-dialog :is(input,textarea,select):not([type=checkbox],[type=radio]){font-size:16px}
  #detail-dialog>#save-error{margin:16px 16px 0}
}