:root{
  color-scheme:light;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",ui-sans-serif,system-ui,sans-serif;
  font-synthesis:none;
  --ink:#182b32;
  --muted:#52666d;
  --line:#dce5e7;
  --canvas:#eef3f6;
  --surface:rgba(255,255,255,.83);
  --accent:#0c6866;
  --accent-deep:#084e4d;
  --soft:#e8f4f1;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;min-width:320px;background:radial-gradient(circle at 91% 7%,rgba(111,196,185,.3),transparent 27rem),radial-gradient(circle at 6% 38%,rgba(147,180,232,.22),transparent 28rem),linear-gradient(145deg,#edf4f7,#f3f7f5 47%,#e8f0f3);background-attachment:fixed;color:var(--ink);font-size:15px;line-height:1.45}
[hidden]{display:none!important}
button,input,select{font:inherit}
button,a,input,select,summary{-webkit-tap-highlight-color:transparent}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline:3px solid #bd7b19;outline-offset:3px}
button{min-height:44px;padding:.6rem 1.05rem;border:1px solid var(--accent);border-radius:12px;background:linear-gradient(145deg,#188984,var(--accent-deep));color:#fff;font-weight:700;cursor:pointer;box-shadow:inset 0 1px 0 rgba(255,255,255,.3),0 5px 12px rgba(8,78,77,.16);transition:filter .16s ease,transform .16s ease,box-shadow .16s ease}
button:hover{filter:brightness(.93);box-shadow:inset 0 1px 0 rgba(255,255,255,.34),0 8px 16px rgba(8,78,77,.22)}
button:active,.action-link:active{transform:scale(.985)}
button:disabled{opacity:.55;cursor:not-allowed;box-shadow:none}
button.secondary,#logout,#refresh{background:rgba(255,255,255,.88);border-color:#c0d4d8;color:var(--accent-deep);box-shadow:inset 0 1px 0 #fff,0 3px 10px rgba(29,66,77,.08)}
button.secondary:hover,#logout:hover,#refresh:hover{background:#eef7f5}
.action-link{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:.6rem 1.05rem;border-radius:12px;background:linear-gradient(145deg,#188984,var(--accent-deep));border:1px solid var(--accent);box-shadow:inset 0 1px 0 rgba(255,255,255,.3),0 5px 12px rgba(8,78,77,.16);color:#fff;text-decoration:none;font-weight:700;transition:filter .16s ease,transform .16s ease}
.action-link:hover{filter:brightness(.93)}
.quiet-link{display:inline-flex;align-items:center;min-height:44px;color:var(--accent-deep);text-decoration:none;font-weight:700}
.quiet-link:hover{text-decoration:underline}
.muted,small{color:var(--muted)}
small{line-height:1.35}
p{margin:.4rem 0;line-height:1.5}
h2,h3{letter-spacing:-.025em}
h2{font-size:clamp(1.45rem,2vw,2rem);line-height:1.17;margin:0}
h3{font-size:1.05rem;margin:.25rem 0 .55rem}
header{height:72px;padding:0 max(1.5rem,calc((100vw - 1420px)/2));display:flex;align-items:center;justify-content:space-between;gap:1rem;border-bottom:1px solid rgba(255,255,255,.82);background:rgba(255,255,255,.6);box-shadow:inset 0 1px 0 rgba(255,255,255,.95),0 8px 28px rgba(27,60,72,.05);backdrop-filter:blur(22px) saturate(1.25);-webkit-backdrop-filter:blur(22px) saturate(1.25)}
.brand{display:flex;align-items:center;gap:.85rem}
.mark{position:relative;isolation:isolate;width:42px;height:42px;display:grid;place-items:center;border:1px solid rgba(255,255,255,.9);border-radius:14px;background:linear-gradient(135deg,rgba(255,255,255,.92),rgba(139,214,207,.62) 52%,rgba(94,160,175,.65));box-shadow:inset 1px 1px 2px #fff,inset -3px -5px 9px rgba(22,95,106,.12),4px 6px 0 rgba(40,113,124,.14),7px 10px 16px rgba(21,80,91,.16);color:var(--accent-deep);font-size:1.28rem;font-weight:800;letter-spacing:-.08em;transform:perspective(120px) rotateX(7deg) rotateY(-12deg)}
.mark::after{content:"";position:absolute;inset:3px;border-top:1px solid rgba(255,255,255,.82);border-left:1px solid rgba(255,255,255,.56);border-radius:10px;pointer-events:none}
header h1{font-size:1.14rem;line-height:1.15;margin:0;font-weight:760;letter-spacing:-.025em}
header p{margin:.15rem 0 0;color:var(--muted);font-size:.78rem}
.environment{padding:.38rem .75rem;border:1px solid rgba(255,255,255,.9);border-radius:999px;background:rgba(255,255,255,.56);box-shadow:inset 0 1px 0 #fff,0 2px 8px rgba(31,79,89,.07);color:#48636b;font-size:.75rem;white-space:nowrap}
main{max-width:1420px;margin:0 auto;padding:1.45rem 1.5rem 3rem}
#loginPanel{max-width:460px;margin:min(7vh,5rem) auto;padding:2.2rem;border:1px solid rgba(255,255,255,.9);border-radius:26px;background:var(--surface);box-shadow:inset 0 1px 0 #fff,0 22px 52px rgba(30,55,64,.12);backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px)}
#loginPanel h2{font-size:1.8rem}.registration{margin-top:1.5rem}.registration summary{cursor:pointer}.registration .form-grid{margin-top:1rem}#profilePanel{padding:1.5rem;border-radius:24px;background:var(--surface)}
#loginPanel form{margin-top:1.5rem}
#loginPanel form button{width:100%;margin-top:.8rem}
#loginError:not(:empty),#notice:not(:empty){padding:.8rem 1rem;margin:.7rem 0;border-radius:12px}
#loginError:not(:empty){background:#fff0ed;color:#8a3323;border:1px solid #f2c9c0}
#notice:not(:empty){background:#eaf5f1;color:#17544d;border:1px solid #c9e5d9}
#appPanel{display:grid;grid-template-columns:204px minmax(0,1fr);gap:0 1.5rem;align-items:start}
#appPanel>.top{grid-column:1/-1;display:flex;justify-content:space-between;align-items:center;min-height:61px;margin-bottom:1.05rem;padding:0 .2rem;border-bottom:1px solid var(--line)}
.top p{margin:0;font-size:.87rem;font-weight:730}
.top small{display:block;margin-top:.1rem;font-size:.78rem}
#logout{min-height:38px;padding:.42rem .8rem;border-radius:10px;font-size:.82rem}
.app-nav{grid-column:1;grid-row:2 / span 5;position:sticky;top:1rem;display:flex;flex-direction:column;gap:.35rem;padding:.65rem;border:1px solid rgba(255,255,255,.84);border-radius:20px;background:linear-gradient(135deg,rgba(255,255,255,.82),rgba(237,250,248,.52));box-shadow:inset 0 1px 0 #fff,inset 0 -1px 0 rgba(108,166,174,.12),0 16px 34px rgba(24,62,73,.12);backdrop-filter:blur(24px) saturate(1.35);-webkit-backdrop-filter:blur(24px) saturate(1.35)}
.app-nav a{display:flex;align-items:center;min-height:46px;padding:.72rem .85rem;border-radius:13px;color:#50666e;text-decoration:none;font-weight:690;transition:background .16s ease,color .16s ease}
.app-nav a:hover{background:#eef5f3;color:var(--accent-deep)}
.app-nav a[aria-current=page]{background:#e1f1eb;color:var(--accent-deep);box-shadow:inset 0 0 0 1px #c6e4da}
#appPanel>#notice,#appPanel>#pending,#overviewPanel,#detail,#createPanel{grid-column:2;min-width:0}
#pending{padding:1rem;border:1px solid #d9ad62;border-radius:16px;background:#fff8eb}
#overviewPanel,#detail,#createPanel{padding:clamp(1.15rem,2.2vw,2rem);border:1px solid rgba(255,255,255,.9);border-radius:23px;background:var(--surface);box-shadow:inset 0 1px 0 #fff,0 20px 48px rgba(26,65,77,.1);backdrop-filter:blur(24px) saturate(1.25);-webkit-backdrop-filter:blur(24px) saturate(1.25)}
#createPanel.view-inactive{display:block!important;height:0;overflow:hidden;visibility:hidden;padding:0!important;border:0!important;margin:0!important;box-shadow:none!important}
.section-head{display:flex;justify-content:space-between;align-items:center;gap:1rem;margin-bottom:1.4rem}
.section-head h2{margin:.12rem 0 .22rem}
.section-head small{font-size:.83rem}
.depth-scene{position:relative;flex:0 0 92px;width:92px;height:68px;margin-left:auto;perspective:360px;transform-style:preserve-3d;pointer-events:none}
.depth-slab{position:absolute;display:block;width:60px;height:47px;left:17px;border:1px solid rgba(255,255,255,.93);border-radius:13px;transform:rotateX(52deg) rotateZ(-34deg);box-shadow:inset 0 1px 0 #fff,3px 8px 12px rgba(28,88,105,.2)}
.depth-slab-back{top:19px;background:linear-gradient(135deg,rgba(107,151,213,.6),rgba(223,238,255,.55));box-shadow:inset 0 1px 0 #fff,6px 10px 0 rgba(83,129,183,.18),8px 17px 16px rgba(28,88,105,.2)}
.depth-slab-middle{top:10px;background:linear-gradient(135deg,rgba(255,255,255,.9),rgba(149,215,207,.65));box-shadow:inset 0 1px 0 #fff,4px 9px 0 rgba(68,150,151,.17),6px 14px 14px rgba(28,88,105,.17)}
.depth-slab-front{top:1px;background:linear-gradient(125deg,rgba(255,255,255,.98),rgba(174,231,220,.72));box-shadow:inset 1px 1px 2px #fff,inset -5px -5px 9px rgba(34,132,139,.13),4px 9px 15px rgba(28,88,105,.16)}
.depth-slab-front::after{content:"";position:absolute;inset:14px 13px;border-top:4px solid rgba(16,113,109,.65);border-bottom:4px solid rgba(16,113,109,.3);border-radius:2px}
.section-actions{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap}
.eyebrow,.form-group-title,.card-kicker{display:block;color:var(--accent);font-size:.68rem;font-weight:800;letter-spacing:.105em;text-transform:uppercase}
.eyebrow{margin:0}
.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.35rem 1.15rem;max-width:900px}
label{display:block;margin:.5rem 0;color:#2d454d;font-size:.88rem;font-weight:680}
input,select{display:block;width:100%;min-width:0;min-height:45px;margin-top:.32rem;padding:.62rem .8rem;border:1px solid #c7d5d8;border-radius:11px;background:#fff;color:var(--ink);font-weight:450}
input:hover,select:hover{border-color:#9bb6ba}
input::placeholder{color:#7b8b91}
input[type=checkbox]{display:inline-block;width:18px;min-height:18px;vertical-align:middle;margin:0 .3rem 0 0}
#createPanel label small{display:block;margin-top:.3rem;font-weight:450}
.form-group-title{grid-column:1/-1;margin:1rem 0 .1rem;padding-top:1rem;border-top:1px solid var(--line)}
.form-group-title:first-child{border:0;padding-top:0;margin-top:0}
.form-actions{grid-column:1/-1;display:flex;align-items:center;gap:1rem;margin-top:1.15rem}
.request-grid{display:grid;grid-template-columns:1fr;gap:.75rem}
.request-card{display:grid;grid-template-columns:minmax(235px,1.4fr) minmax(165px,.8fr) minmax(190px,.85fr);grid-template-areas:"top top top" "context schedule metrics" "context deadline metrics" "next next footer";gap:.4rem 1.4rem;align-items:start;padding:1.15rem 1.3rem;border:1px solid rgba(255,255,255,.92);border-radius:18px;background:linear-gradient(125deg,rgba(255,255,255,.94),rgba(243,252,250,.72));box-shadow:inset 0 1px 0 #fff,inset 0 -1px 0 rgba(87,150,161,.11),0 10px 21px rgba(23,62,73,.09),0 22px 34px rgba(26,66,78,.045);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);transform:translateZ(0);transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease}
@media(hover:hover){.request-card:hover{border-color:rgba(150,207,204,.9);box-shadow:inset 0 1px 0 #fff,0 16px 27px rgba(23,62,73,.15),0 27px 43px rgba(26,66,78,.09);transform:perspective(1000px) rotateX(1deg) rotateY(-1deg) translateY(-3px)}}
.card-top{grid-area:top;display:flex;align-items:center;justify-content:space-between;gap:.5rem}
.card-top small{font-size:.73rem}
.card-context{grid-area:context;min-width:0}
.card-name{font-size:1.18rem;line-height:1.22;margin:.15rem 0 .5rem;overflow-wrap:anywhere}
.card-context p{margin:0;line-height:1.3;overflow-wrap:anywhere}
.card-context p strong{font-weight:700}
.card-context small{display:block;margin-top:.55rem;font-size:.75rem}
.card-schedule{grid-area:schedule}
.card-schedule h3{font-size:1.04rem;line-height:1.2;margin:.24rem 0 .15rem}
.card-schedule p{margin:0;color:#355861;font-size:.9rem;font-weight:650}
.metrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.3rem;padding:.7rem .75rem;border:1px solid rgba(255,255,255,.8);border-radius:13px;background:linear-gradient(135deg,rgba(240,250,248,.88),rgba(219,238,237,.62));box-shadow:inset 0 1px 0 #fff}
.request-card .metrics{grid-area:metrics}
.metric{min-width:0;text-align:center}
.metric strong{display:block;font-size:1.38rem;line-height:1.2;font-variant-numeric:tabular-nums}
.metric span{display:block;margin-top:.12rem;color:#4e666c;font-size:.7rem;line-height:1.25}
.metric:last-child strong{color:var(--accent-deep)}
.card-deadline{grid-area:deadline;margin:0;color:#365159;font-size:.8rem}
.card-deadline span{display:block;color:#667c82;font-size:.67rem;font-weight:750;letter-spacing:.06em;text-transform:uppercase}
.card-next{grid-area:next;align-self:center;margin:.3rem 0 0;padding-top:.72rem;border-top:1px solid #e9eff0;color:#4b626a;font-size:.81rem}
.card-next span{color:var(--accent-deep);font-weight:760}
.card-footer{grid-area:footer;display:flex;align-items:center;justify-content:flex-end;gap:.65rem;margin-top:.2rem;padding-top:.4rem;border-top:1px solid #e9eff0}
.card-footer button{min-height:44px;padding:.45rem .75rem;font-size:.82rem;white-space:nowrap}
.card-reference{color:#788a90;font-size:.69rem;white-space:nowrap}
.badge{display:inline-flex;align-items:center;min-height:26px;padding:.2rem .66rem;border-radius:999px;background:#e1f2e9;color:#126448;font-size:.73rem;font-weight:780}
.badge.warning{background:#fff1d7;color:#825313}
.badge.critical{background:#fae9e5;color:#923b2d}
#detail{padding-top:1.2rem}
#backToList{margin:0 0 1.15rem}
.detail-head{display:grid;grid-template-columns:minmax(0,1fr) minmax(255px,330px);gap:1.2rem;align-items:center;padding-bottom:1rem;border-bottom:1px solid var(--line)}
.detail-head h2{margin:.45rem 0 .2rem;overflow-wrap:anywhere}
.detail-head p{margin:.1rem 0}
.detail-head .metrics{margin:0}
.destination{display:flex;flex-direction:column;gap:.14rem;padding:.85rem 1rem;margin:1rem 0 .7rem;border:1px solid #cce3dc;border-radius:14px;background:rgba(243,249,246,.88)}
.destination strong{font-size:1.1rem;overflow-wrap:anywhere}
.destination small{margin-top:.2rem}
.next-action{padding:.85rem 1rem;margin:.75rem 0;border:1px solid #d2e8e1;border-radius:14px;background:rgba(237,247,242,.9)}
.next-action strong{color:#175c4f}
.next-action p{margin:.18rem 0 0}
.jump-link{margin-top:.65rem}
.detail-facts{margin:.8rem 0 1rem;color:#38535b;line-height:1.65}
.detail-block{margin-top:1.2rem;padding-top:1.1rem;border-top:1px solid var(--line)}
.detail-block>h3{font-size:1.1rem;margin:0 0 .7rem}
.card{padding:1rem;margin:.65rem 0;border:1px solid #dfe8e9;border-radius:15px;background:#fff}
.card p{margin:.35rem 0}
.assignment-actions{margin-top:.8rem;padding-top:.6rem;border-top:1px solid var(--line)}
details>summary{min-height:37px;padding:.45rem 0;color:var(--accent-deep);font-weight:720;cursor:pointer}
.audit{list-style:none;margin:0;padding:0}
.audit li{display:grid;grid-template-columns:minmax(125px,180px) 1fr auto;gap:.7rem;align-items:start;padding:.6rem .25rem;border-bottom:1px solid #e7eeef}
.audit time,.audit small{color:var(--muted);font-size:.8rem}
form.inline{display:flex;flex-wrap:wrap;gap:.65rem;align-items:end;margin:.8rem 0}
form.inline label{flex:1 1 165px;margin:0}
form.inline button{flex:0 0 auto}
.empty{padding:1.5rem;border:1px dashed #b6c9cb;border-radius:14px;background:#f9fbfb;color:var(--muted)}
.warn{color:#84500c;font-weight:720}
@media(max-width:1050px){
  #appPanel{grid-template-columns:174px minmax(0,1fr);gap:0 1rem}
  .depth-scene{display:none}
  .request-card{grid-template-columns:minmax(185px,1.2fr) minmax(145px,.8fr);grid-template-areas:"top top" "context schedule" "context deadline" "metrics metrics" "next footer";gap:.45rem 1rem}
  .request-card .metrics{max-width:360px}
}
@media(max-width:760px){
  header{height:64px;padding:0 1rem}
  main{padding:.8rem .85rem 2rem}
  #appPanel{display:block}
  #appPanel>.top{min-height:50px;margin-bottom:.6rem}
  .app-nav{position:sticky;top:.5rem;z-index:5;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));width:100%;margin:0 0 .8rem;padding:.3rem;border-radius:15px}
  #appPanel[data-role=CARRIER] .app-nav{grid-template-columns:repeat(2,minmax(0,1fr))}
  .app-nav a{min-width:0;min-height:44px;justify-content:center;padding:.55rem .3rem;white-space:normal;overflow-wrap:anywhere;text-align:center;line-height:1.18;font-size:.87rem}
  #appPanel[data-view=detail] .app-nav{display:none}
  #overviewPanel,#detail,#createPanel{padding:1rem;border-radius:19px}
  .section-head{align-items:flex-start;margin-bottom:1rem}
  .section-head h2{font-size:1.4rem}
  .section-actions{justify-content:flex-end}
  .form-grid{grid-template-columns:1fr}
  .detail-head{grid-template-columns:1fr;gap:.75rem}
  .detail-head .metrics{max-width:450px}
  .audit li{grid-template-columns:1fr}
  form.inline{display:block}
  form.inline label{margin:.6rem 0}
}
@media(max-width:550px){
  .brand{gap:.55rem}
  .mark{width:38px;height:38px;border-radius:12px}
  header p{display:none}
  .environment{max-width:120px;white-space:normal;text-align:center;font-size:.66rem;line-height:1.15}
  .top p{font-size:.8rem}
  .top small{font-size:.7rem}
  #logout{min-height:36px;padding:.35rem .55rem}
  .section-head{display:block;margin-bottom:.7rem}
  .section-head small{display:block}
  .section-actions{justify-content:flex-start;margin-top:.65rem}
  .section-actions #refresh{min-height:44px}
  .request-card{display:flex;flex-direction:column;gap:.35rem;padding:.8rem;border-radius:15px}
  .card-top,.card-context,.card-schedule,.request-card .metrics,.card-deadline,.card-next,.card-footer{width:100%}
  .card-name{font-size:1.08rem;margin:.15rem 0 .3rem}
  .card-context small{margin-top:.35rem}
  .card-schedule{padding-top:.3rem;border-top:1px solid #ebf0f1}
  .card-schedule h3{display:inline;font-size:.91rem}
  .card-schedule p{display:inline;font-size:.86rem}
  .card-schedule p::before{content:" · "}
  .request-card .metrics{max-width:none;padding:.44rem .5rem}
  .metric strong{font-size:1.15rem}
  .metric span{font-size:.67rem}
  .card-deadline{font-size:.74rem}
  .card-deadline span{display:inline}
  .card-next{margin:0;padding-top:.4rem;font-size:.75rem}
  .card-footer{padding-top:.3rem;margin:0;justify-content:space-between}
  .card-footer button{min-height:44px}
  .detail-head h2{font-size:1.35rem}
  .destination strong{font-size:1rem}
  .form-actions{flex-wrap:wrap}
}
@media(max-width:380px){
  main{padding:.55rem .55rem 2rem}
  #overviewPanel,#detail,#createPanel{padding:.8rem}
  #overviewPanel .section-head small{display:none}
  #appPanel[data-role=CARRIER] #overviewPanel .section-head{display:flex;align-items:center;justify-content:space-between;gap:.35rem}
  #appPanel[data-role=CARRIER] #overviewPanel .section-actions{margin:0}
  #appPanel[data-role=CARRIER] #overviewTitle{font-size:1.15rem}
  #appPanel[data-role=CARRIER] #refresh{font-size:0;width:44px;height:44px;min-height:44px;padding:0}
  #appPanel[data-role=CARRIER] #refresh::before{content:"↻";font-size:1.35rem;line-height:1}
}
@media(prefers-reduced-transparency:reduce){header,.app-nav,#overviewPanel,#detail,#createPanel,#loginPanel,.request-card{backdrop-filter:none;-webkit-backdrop-filter:none;background:#fff}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}button,.action-link,.app-nav a,.request-card{transition:none}.request-card:hover{transform:none}}
@media(forced-colors:active){.depth-scene{display:none}.mark{transform:none;box-shadow:none}.app-nav,.request-card,.badge,.next-action,.destination{border:1px solid CanvasText}}

/* WEB-TRENDS-01: soft superellipse corners, directional light and tactile depth. */
:root{--light-rim:rgba(255,255,255,.94);--shadow-ink:rgba(27,58,68,.16)}
body{background-image:radial-gradient(circle at 87% 5%,rgba(112,204,196,.32),transparent 26rem),radial-gradient(circle at 8% 57%,rgba(123,159,214,.18),transparent 30rem),repeating-linear-gradient(112deg,rgba(255,255,255,.12) 0 1px,transparent 1px 13px),linear-gradient(145deg,#e8f1f4,#f5f8f7 48%,#e8f0f2)}
header{border-bottom-color:rgba(255,255,255,.96);background:linear-gradient(111deg,rgba(255,255,255,.82),rgba(228,243,244,.55) 54%,rgba(255,255,255,.78));box-shadow:inset 0 1px 0 #fff,inset 0 -1px 0 rgba(112,159,169,.15),0 11px 25px rgba(20,59,70,.08)}
.mark{border-radius:16px;corner-shape:superellipse(2);background:linear-gradient(140deg,#fff 4%,#d9f4ed 28%,#95cac9 54%,#edf9f8 70%,#68a5ad 100%);box-shadow:inset 2px 3px 3px #fff,inset -5px -8px 12px rgba(22,96,111,.25),2px 4px 0 rgba(255,255,255,.8),6px 9px 0 rgba(40,113,124,.14),10px 15px 24px rgba(21,80,91,.18)}
#appPanel{--role-accent:#0c6866;--role-deep:#084e4d;--role-wash:rgba(115,203,189,.18);--role-shadow:rgba(10,95,91,.18)}
#appPanel[data-role=CARRIER]{--accent:#315e9b;--accent-deep:#244675;--role-accent:#315e9b;--role-deep:#244675;--role-wash:rgba(126,159,218,.19);--role-shadow:rgba(44,80,139,.2)}
#loginPanel,.app-nav,#overviewPanel,#detail,#createPanel{border-color:var(--light-rim);border-radius:28px;corner-shape:superellipse(2);background:linear-gradient(130deg,rgba(255,255,255,.9),rgba(255,255,255,.72) 59%,rgba(233,247,247,.76));box-shadow:inset 1px 2px 0 #fff,inset -1px -2px 0 rgba(113,159,168,.11),0 9px 16px rgba(31,68,77,.055),0 28px 58px rgba(27,58,68,.13)}
.app-nav{border-radius:23px;corner-shape:superellipse(2);background:linear-gradient(138deg,rgba(255,255,255,.9),rgba(229,245,245,.66))}
.app-nav a{border-radius:16px;corner-shape:superellipse(2)}
.app-nav a[aria-current=page]{background:linear-gradient(135deg,rgba(255,255,255,.84),var(--role-wash));box-shadow:inset 0 1px 0 #fff,inset 0 0 0 1px var(--role-wash),0 4px 11px var(--role-shadow);color:var(--role-deep)}
.section-head{position:relative}
.section-head h2{font-weight:760;letter-spacing:-.038em}
.route-sketch{position:absolute;inset:4px auto auto -8px;width:112px;height:66px;overflow:visible;stroke:var(--role-accent);stroke-width:1.3;stroke-linecap:round;stroke-linejoin:round;opacity:.52;transform:rotate(-9deg)}
.route-sketch path:nth-child(2){stroke-width:.6;opacity:.55;stroke-dasharray:3 4}
.route-sketch circle{fill:#fff;stroke-width:1.3}
.depth-scene .route-sketch{z-index:0}
.depth-slab{z-index:1}
.creation-sketch{display:block;width:166px;height:30px;margin-top:.55rem;stroke:var(--role-accent);stroke-width:1.35;stroke-linecap:round;stroke-linejoin:round;opacity:.56}
.creation-sketch path:nth-child(2){stroke-width:.7;stroke-dasharray:3 4;opacity:.55}
.creation-sketch circle{fill:#fff}
.request-card,.card{border:1px solid var(--light-rim);border-radius:22px;corner-shape:superellipse(2);background:linear-gradient(135deg,rgba(255,255,255,.97),rgba(246,252,251,.8) 52%,rgba(226,244,242,.67));box-shadow:inset 1px 2px 0 #fff,inset -1px -2px 0 rgba(94,142,156,.11),0 6px 12px rgba(25,68,78,.07),0 22px 32px rgba(27,58,68,.07)}
.request-card{border-left:3px solid var(--role-accent)}
.request-card:hover{border-left-color:var(--role-deep)}
.metrics{border-radius:18px;corner-shape:superellipse(2);background:linear-gradient(130deg,rgba(255,255,255,.95),var(--role-wash));box-shadow:inset 0 1px 0 #fff,inset 0 -1px 0 rgba(94,142,156,.12),0 4px 9px rgba(26,66,78,.055)}
.metric:last-child strong{color:var(--role-deep)}
.destination,.next-action{border-radius:18px;corner-shape:superellipse(2);background:linear-gradient(125deg,rgba(255,255,255,.96),var(--role-wash))}
.next-action strong{color:var(--role-deep)}
button,.action-link{position:relative;isolation:isolate;overflow:hidden;border-radius:15px;corner-shape:superellipse(2);border-color:var(--role-deep,var(--accent-deep));background:linear-gradient(155deg,#fff8 0%,transparent 23%),linear-gradient(138deg,var(--role-accent,var(--accent)),var(--role-deep,var(--accent-deep)));box-shadow:inset 0 1px 0 rgba(255,255,255,.52),inset 0 -2px 0 rgba(0,31,40,.2),0 2px 0 rgba(4,47,52,.25),0 7px 15px var(--role-shadow,rgba(8,78,77,.16));transition:transform .16s ease,box-shadow .16s ease,filter .16s ease}
button::after,.action-link::after{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle at var(--press-x,50%) var(--press-y,50%),rgba(255,255,255,.62),transparent 68%);opacity:0;transition:opacity .12s ease}
button:active,.action-link:active{transform:translateY(2px) scale(.988);box-shadow:inset 0 2px 5px rgba(0,31,40,.22),0 1px 1px var(--role-shadow,rgba(8,78,77,.16))}
button:active::after,.action-link:active::after{opacity:1}
button.secondary,#logout,#refresh{background:linear-gradient(145deg,rgba(255,255,255,.98),rgba(230,243,243,.88));border-color:rgba(163,193,199,.8);box-shadow:inset 1px 2px 0 #fff,inset -1px -2px 0 rgba(99,142,153,.12),0 3px 9px rgba(29,66,77,.1);color:var(--role-deep,var(--accent-deep))}
button.secondary:hover,#logout:hover,#refresh:hover{background:linear-gradient(145deg,#fff,rgba(222,239,242,.92))}
input,select{border-radius:14px;corner-shape:superellipse(2);background:linear-gradient(180deg,#f6fafb,#fff 35%);box-shadow:inset 0 2px 5px rgba(36,75,84,.06),0 1px 0 #fff}
input:focus,select:focus{border-color:var(--role-accent,var(--accent));background:#fff;box-shadow:inset 0 1px 3px rgba(36,75,84,.04),0 0 0 3px var(--role-wash,rgba(115,203,189,.18))}
.form-group-title{position:relative;padding-left:1.7rem;border-top-color:#d8e5e7}
.form-group-title::before{content:"";position:absolute;left:0;top:.4rem;width:1.15rem;height:1.15rem;border-radius:8px;corner-shape:superellipse(2);background:linear-gradient(145deg,#fff,var(--role-wash,rgba(115,203,189,.18)));border:1px solid rgba(162,194,199,.7);box-shadow:inset 1px 1px 0 #fff,2px 3px 0 var(--role-wash,rgba(115,203,189,.18));transform:rotate(-7deg)}
.form-group-title:first-child::before{top:-.12rem}
@media(min-width:761px){#createPanel{padding-top:1.25rem;padding-bottom:1.25rem}#createPanel .section-head{margin-bottom:.6rem}.form-grid{gap:.12rem 1.05rem}.form-grid label{margin:.2rem 0}.form-grid input,.form-grid select{min-height:43px}.form-group-title{margin:.48rem 0 .05rem;padding-top:.55rem}.form-actions{margin-top:.48rem}.creation-sketch{height:22px;margin-top:.3rem}}
@media(max-width:760px){#overviewPanel,#detail,#createPanel{border-radius:23px}.request-card{border-radius:19px}.route-sketch{opacity:.36}}
@media(prefers-reduced-transparency:reduce){header,#loginPanel,.app-nav,#overviewPanel,#detail,#createPanel,.request-card,.card{backdrop-filter:none;-webkit-backdrop-filter:none;background:#fff}.route-sketch{opacity:.32}}
@media(prefers-reduced-motion:reduce){button,.action-link,.request-card{transition:none}button:active,.action-link:active{transform:none}.route-sketch{transform:none}}
@media(forced-colors:active){.route-sketch{display:none}button,.action-link,.request-card,.card,#loginPanel,#overviewPanel,#detail,#createPanel{background:Canvas;box-shadow:none;border:1px solid CanvasText}}

/* WEB-W2C-01: separate new information from current action. */
.nav-count{display:inline-grid;place-items:center;min-width:1.45rem;height:1.45rem;margin-left:auto;padding:0 .3rem;border-radius:999px;background:#b85b32;color:#fff;font-size:.72rem;font-weight:800}
.attention-panel{margin:-.25rem 0 1.15rem;padding:1rem 1.1rem;border:1px solid #cfdfdf;border-radius:19px;background:linear-gradient(135deg,rgba(238,248,246,.94),rgba(251,253,252,.9));box-shadow:inset 0 1px 0 #fff,0 7px 17px rgba(28,72,78,.07)}
.mobile-attention{display:none}
.mobile-attention[hidden]{display:none!important}
.mobile-attention summary{cursor:pointer;display:flex;justify-content:space-between;gap:.5rem;font-weight:750}
.mobile-attention summary strong{font-size:.75rem;color:var(--role-deep)}
.mobile-attention .freshness{display:block;text-align:left;margin-top:.45rem}
.commit-facts{display:grid;gap:.22rem;margin:.6rem 0;padding:.7rem .8rem;border:1px solid #d5e3e3;border-radius:13px;background:#f4faf9;font-size:.82rem}
.commit-facts span,.commit-facts small{overflow-wrap:anywhere}
.attention-head{display:flex;align-items:start;justify-content:space-between;gap:.8rem}
.attention-head h3{margin:.12rem 0 .55rem}
.freshness{font-size:.73rem;color:var(--muted);text-align:right}
.attention-row{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.65rem 0;border-top:1px solid #dbe8e8}
.attention-row:first-child{border-top:0}
.attention-row>div{min-width:0}
.attention-row strong,.attention-row small{display:block;overflow-wrap:anywhere}
.attention-row strong{font-size:.94rem}
.attention-row small{margin-top:.18rem}
.attention-row button{min-width:86px}
.card-signals{display:flex;align-items:center;justify-content:flex-end;gap:.35rem;flex-wrap:wrap}
.signal-new,.signal-action,.signal-waiting,.signal-confirmed{display:inline-flex;align-items:center;min-height:24px;padding:.15rem .5rem;border-radius:999px;font-size:.69rem;font-weight:760;line-height:1.2}
.signal-new{background:#e8ecfb;color:#294776;border:1px solid #c6d2ee}
.signal-action{background:#fff1df;color:#805020;border:1px solid #eecf9e}
.signal-waiting{background:#eef3f7;color:#36566d;border:1px solid #cbd9e1}
.signal-confirmed{background:#e7f5ea;color:#265c42;border:1px solid #bcdcc7}
.journey-guide{margin:1rem 0;padding:1rem;border:1px solid #d8e6e7;border-radius:19px;background:linear-gradient(132deg,rgba(252,255,255,.94),var(--role-wash))}
.journey-heading{display:flex;justify-content:space-between;align-items:start;gap:.6rem}
.journey-heading h3{margin:.15rem 0 .65rem}
.journey-heading small{text-align:right}
.journey-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.5rem}
.journey-step{min-width:0;padding:.55rem;border:1px solid #d5e2e4;border-radius:15px;background:rgba(255,255,255,.82)}
.journey-step summary{display:flex;align-items:center;gap:.5rem;cursor:pointer;font-size:.85rem;font-weight:720}
.journey-step summary::marker{content:''}
.journey-step p{margin:.55rem .1rem 0;font-size:.79rem;color:#38545e}
.step-orb{flex:none;display:grid;place-items:center;width:1.8rem;height:1.8rem;border-radius:10px;background:linear-gradient(140deg,#fff,var(--role-wash));border:1px solid #bed4da;color:var(--role-deep);box-shadow:inset 0 1px 0 #fff,2px 3px 0 var(--role-wash)}
.journey-step[open] .step-orb{background:var(--role-deep);color:#fff}
@media(max-width:760px){.attention-panel{display:none}.mobile-attention{display:block;margin:-.25rem 0 .7rem;padding:.65rem .8rem;border:1px solid #cfdfdf;border-radius:14px;background:#f1f8f6}.attention-head{align-items:center}.attention-row{align-items:flex-start}.attention-row button{min-width:70px}.journey-steps{grid-template-columns:1fr}.journey-step{padding:.5rem}.journey-heading{display:block}.journey-heading small{text-align:left;display:block;margin-bottom:.5rem}}
@media(max-width:380px){.attention-panel{padding:.7rem;margin-bottom:.7rem}.attention-row{gap:.4rem}.attention-row small{font-size:.69rem}.card-signals{justify-content:flex-start}.card-signals small{display:none}}
@media(prefers-reduced-motion:reduce){.journey-step,.step-orb{transition:none}}
@media(forced-colors:active){.attention-panel,.mobile-attention,.attention-row,.journey-guide,.journey-step,.signal-new,.signal-action,.signal-waiting,.signal-confirmed,.nav-count{border:1px solid CanvasText;background:Canvas;color:CanvasText;box-shadow:none}}

/* WEB-W2E-01: calm separation of active work, cancellation and history. */
#historyPanel{grid-column:2;min-width:0;padding:clamp(1.15rem,2.2vw,2rem);border:1px solid var(--light-rim);border-radius:28px;corner-shape:superellipse(2);background:linear-gradient(130deg,rgba(255,255,255,.9),rgba(255,255,255,.72) 59%,rgba(233,247,247,.76));box-shadow:inset 1px 2px 0 #fff,inset -1px -2px 0 rgba(113,159,168,.11),0 9px 16px rgba(31,68,77,.055),0 28px 58px rgba(27,58,68,.13);backdrop-filter:blur(24px) saturate(1.25);-webkit-backdrop-filter:blur(24px) saturate(1.25)}
.history-controls{display:grid;grid-template-columns:minmax(0,2fr) minmax(170px,1fr);gap:.8rem;margin:0 0 1.1rem}
.history-controls label{margin:0}
.cancel-panel{margin:1rem 0;border-left:4px solid #b47824;background:linear-gradient(125deg,#fff,#fff8ee)}
.cancel-panel form{margin-top:.7rem}
.cancel-panel form[data-cancel-form]{display:flex;align-items:end;gap:.75rem;flex-wrap:wrap;border-top:1px solid var(--line);padding-top:.8rem}
.cancel-panel form[data-cancel-form] label{flex:1 1 220px;margin:0}
.cancel-panel form[data-cancel-form] strong{flex:0 1 220px;padding-bottom:.7rem}
.audit li small{display:block;overflow-wrap:anywhere}
@media(max-width:760px){#historyPanel{padding:1rem;border-radius:23px}.history-controls{grid-template-columns:1fr}.cancel-panel form[data-cancel-form] button{width:100%}}
@media(max-width:380px){#historyPanel{padding:.8rem}}
@media(prefers-reduced-transparency:reduce){#historyPanel{backdrop-filter:none;-webkit-backdrop-filter:none;background:#fff}}
@media(forced-colors:active){#historyPanel,.cancel-panel{background:Canvas;box-shadow:none;border:1px solid CanvasText}}

/* WEB-ADDR-01: accessible suggestions keep the address editable at all times. */
.address-field{position:relative;min-width:0}
.address-field>label{display:block}
.address-options{position:relative;z-index:1;max-height:15rem;overflow-y:auto;margin-top:.35rem;padding:.35rem;border:1px solid #b8d0d4;border-radius:15px;background:#fff;box-shadow:0 10px 22px rgba(25,65,75,.14)}
.address-options[hidden]{display:none}
.address-options button{display:block;width:100%;padding:.65rem .75rem;border:0;border-radius:10px;background:transparent;box-shadow:none;color:#19343d;text-align:left;font:inherit;line-height:1.35;overflow-wrap:anywhere;transform:none}
.address-options button:hover,.address-options button[aria-selected=true]{background:#e5f3f1;color:#064f4d}
.address-status,.address-credit{display:block;margin-top:.2rem;color:var(--muted);font-size:.73rem;line-height:1.35}
.address-credit a{color:var(--role-deep,#08545a)}
@media(max-width:760px){.address-options{max-height:12rem}}
@media(forced-colors:active){.address-options{border:1px solid CanvasText;box-shadow:none}.address-options button[aria-selected=true]{outline:2px solid Highlight}}

/* TDABC-WERK-01B: independent, synthetic plant cost cases. */
#tdabcPanel{grid-column:2;min-width:0;padding:clamp(1rem,2vw,1.8rem);border:1px solid var(--light-rim);border-radius:27px;background:linear-gradient(135deg,rgba(255,255,255,.95),rgba(237,249,247,.84));box-shadow:inset 1px 2px 0 #fff,0 20px 48px rgba(26,65,77,.1)}
.tdabc-heading,.tdabc-section-head{display:flex;align-items:center;justify-content:space-between;gap:1rem}
.tdabc-heading h2,.tdabc-heading h3{margin:.2rem 0}
.tdabc-create{display:flex;align-items:end;gap:.75rem;flex-wrap:wrap;margin:1rem 0 1.3rem}
.tdabc-create label{flex:1 1 260px;margin:0}
.tdabc-case-list{display:grid;gap:.65rem}
.tdabc-case{display:flex;justify-content:space-between;gap:1rem;padding:1rem;border:1px solid #d5e5e4;border-radius:16px;background:#fff;color:#173b42;text-decoration:none;box-shadow:0 5px 14px rgba(23,62,73,.06)}
.tdabc-case:hover,.tdabc-case:focus-visible{border-color:#0c6866}
.tdabc-case span{color:#4b626b}
.tdabc-result,.tdabc-unavailable{display:flex;justify-content:space-between;gap:1rem;align-items:center;margin:1rem 0;padding:1rem 1.2rem;border-radius:18px;background:#e4f3ef;border:1px solid #b8ded2}
.tdabc-unavailable{background:#fff4e9;border-color:#e9d1af}
.tdabc-result strong,.tdabc-unavailable strong{font-size:1.25rem}
.tdabc-breakdown,.tdabc-section,.tdabc-trail{margin:1rem 0;padding:1rem;border:1px solid #d9e6e5;border-radius:17px;background:rgba(255,255,255,.82)}
.tdabc-breakdown h3,.tdabc-section h3{margin:0 0 .2rem}
.tdabc-breakdown p,.tdabc-section p{color:#4c6269;margin:.2rem 0 .8rem}
.tdabc-table-wrap{max-width:100%;overflow:auto}
.tdabc-table-wrap table{width:100%;border-collapse:collapse;text-align:left}
.tdabc-table-wrap th,.tdabc-table-wrap td{padding:.45rem;border-bottom:1px solid #dfe9e8;white-space:nowrap}
.tdabc-rows{display:grid;gap:.55rem}
.tdabc-row{display:flex;align-items:end;gap:.55rem;flex-wrap:wrap;padding:.7rem;border:1px solid #e1ebea;border-radius:13px;background:#f8fcfb}
.tdabc-row label{flex:1 1 125px;min-width:0;margin:0;font-size:.78rem}
.tdabc-row input,.tdabc-row select{width:100%;min-width:0;min-height:43px}
.tdabc-row button{flex:0 0 auto}
.tdabc-id{display:block;min-height:43px;padding:.65rem;border:1px solid #d0dfdf;border-radius:12px;background:#fff}
.tdabc-trail summary{cursor:pointer;font-weight:700}
.tdabc-trail,#tdabcEditor{margin:1rem 0;padding:.8rem 1rem;border:1px solid #d9e6e5;border-radius:15px;background:rgba(255,255,255,.82)}
#tdabcEditor>summary{cursor:pointer;font-weight:750;color:#0a5553}
.tdabc-trail li{margin:.35rem 0;overflow-wrap:anywhere}
@media(max-width:760px){.app-nav{grid-template-columns:repeat(4,minmax(0,1fr))}#tdabcPanel{padding:.85rem;border-radius:21px}.tdabc-heading,.tdabc-section-head,.tdabc-result,.tdabc-unavailable,.tdabc-case{align-items:stretch;flex-direction:column}.tdabc-create button,.tdabc-section-head button,.tdabc-row button{width:100%}.tdabc-row label{flex-basis:calc(50% - .5rem)}}
@media(max-width:380px){.tdabc-row label{flex-basis:100%}.app-nav a{font-size:.76rem}}
@media(prefers-reduced-transparency:reduce){#tdabcPanel{background:#fff;backdrop-filter:none}}
@media(forced-colors:active){#tdabcPanel,.tdabc-section,.tdabc-breakdown,.tdabc-case,.tdabc-result,.tdabc-unavailable{background:Canvas;border:1px solid CanvasText;box-shadow:none}}

.partner-card{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin:.75rem 0;padding:1rem;border-radius:18px}.partner-card span{color:var(--muted)}#partnersPanel{padding:1.5rem;border-radius:24px;background:var(--surface)}@media(max-width:760px){.partner-card{flex-wrap:wrap}}


.product-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:1rem;margin-top:1.5rem}.product-tile{display:flex;flex-direction:column;gap:.65rem;min-height:190px;padding:1.5rem;border:1px solid #bed9da;border-radius:24px;background:linear-gradient(140deg,#fff,#e7f4f2);box-shadow:0 12px 30px #164b5018;color:#123b3c;text-decoration:none}.product-tile:hover,.product-tile:focus-visible{transform:translateY(-2px);box-shadow:0 16px 35px #164b502b}.product-tile strong{font-size:1.6rem}.product-symbol{display:grid;place-items:center;width:3rem;height:3rem;border-radius:15px;background:#d7ecea;color:#005c5b;font-weight:800}.product-tile[hidden]{display:none}

.slot-rows{display:grid;gap:.75rem;grid-column:1/-1}.slot-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr)) auto;gap:.75rem;align-items:end;padding:.8rem;border:1px solid #d0e0e1;border-radius:16px}.legacy-create{grid-column:1/-1;margin-top:1.5rem}.slot-summary p{margin:.3rem 0}@media(max-width:650px){.slot-row{grid-template-columns:1fr 1fr}.slot-row label:first-child{grid-column:1/-1}}

@media(max-width:760px){#appPanel[data-role=PLANT] .app-nav{grid-template-columns:repeat(3,minmax(0,1fr))}.app-nav a{overflow-wrap:normal;hyphens:auto}}
