/* VANTA CITY V4 — clean environment, mounted terminal, protected scale.
   Scene artwork always scales uniformly. The clearance rectangle uses the same
   cover projection as the artwork and is retained for layout regression checks. */
.bn-exact-app.ws-mode{height:var(--vanta-viewport,100dvh);min-height:0;overflow:hidden}
.bn-exact-app.ws-mode .main-pane{height:100%;min-height:0;min-width:0;display:flex;flex-direction:column;padding-bottom:var(--vanta-safe-bottom,0px)}
.bn-exact-app.ws-mode .topbar{flex:none}
.bn-exact-app.ws-mode .main-scroll{flex:1;min-height:0;width:100%;max-width:none;margin:0;padding:0!important;overflow:hidden;background:#0b0809}
.bn-exact-app.ws-mode .app-footer{display:none!important}
.vanta-workstation{height:100%;width:100%;min-width:0;overflow:hidden;isolation:isolate;container-type:size}
.ws-stage-enter{--art-width:max(100cqw,177.6833cqh);--art-height:max(100cqh,56.2799cqw);--scale-top:calc(50cqh + var(--art-height)*.09);--board-top:7cqh;--mount:perspective(1800px) rotateY(8deg) rotateZ(1deg);position:relative;width:100%;height:100%;overflow:hidden;container-type:size;background:#10090c}
.ws-scene{position:absolute;inset:0;background:url('./assets/workstation-clean-v4.png') center/cover no-repeat;pointer-events:none}
.ws-scale-clearance{position:absolute;left:calc(50% - var(--art-width)*.085);top:var(--scale-top);width:calc(var(--art-width)*.20);height:calc(var(--art-height)*.145);pointer-events:none}
.ws-board{position:absolute;z-index:3;left:4.5%;top:var(--board-top);width:46%;height:min(48cqh,calc(var(--scale-top) - var(--board-top) - 28px));transform:var(--mount);transform-origin:center;opacity:1}
.ws-board::before,.ws-board::after{content:'';position:absolute;z-index:-1;top:-8px;bottom:-8px;width:13px;border:1px solid #65505b;border-radius:3px;background:linear-gradient(90deg,#161217,#45323a,#1b1219);box-shadow:2px 4px 5px #0009}
.ws-board::before{left:6%}.ws-board::after{right:6%}
.ws-board-frame{position:relative;width:100%;height:100%;display:flex;flex-direction:column;padding:clamp(12px,1.65cqh,20px);border:3px solid #392c34;border-radius:8px;background:linear-gradient(135deg,#21141e,#101018 48%,#0e0e14);box-shadow:inset 0 0 0 1px #86717d44,inset 0 0 0 5px #06070aaa,-4px 7px 9px #000b,0 0 12px #ff234218;color:#f2edf0}
.ws-board-frame::before{content:'';position:absolute;left:6%;right:6%;top:0;height:2px;background:linear-gradient(90deg,#ff3156,transparent 55%);box-shadow:0 0 9px #ff2f5b66}
.ws-board-frame::after{content:'';position:absolute;width:5px;height:5px;left:5px;top:5px;border-radius:50%;background:#8b7782;box-shadow:0 0 0 1px #050306;pointer-events:none}
.ws-board-head{display:flex;align-items:center;justify-content:space-between;gap:10px;flex:none;padding-bottom:clamp(8px,1.4cqh,16px)}
.ws-title-block{min-width:0}.ws-eyebrow{font-size:clamp(8px,.8cqw,11px);font-weight:800;letter-spacing:.16em;color:#ed728d}
.ws-title-block h2{margin:4px 0 0;font-size:clamp(20px,2.05cqw,31px);font-weight:900;line-height:1.05;letter-spacing:-.035em;color:#f3eff3}
.ws-total{display:flex;align-items:center;gap:5px;flex:none;color:#b8b3c1;font-size:clamp(8px,.65cqw,10px);font-weight:700;letter-spacing:.04em;white-space:nowrap}
.ws-total i{height:4px;width:4px;border-radius:50%;background:#ff526c;box-shadow:0 0 6px #ff3156}
.ws-task-list{flex:1;min-height:0;display:grid;grid-template-rows:repeat(3,minmax(0,1fr));gap:clamp(5px,.9cqh,9px)}
.ws-task{display:flex;gap:8px;align-items:stretch;min-height:0;padding:7px 9px;border:1px solid #59465366;border-radius:5px;background:linear-gradient(110deg,#251a27aa,#11121b);transition:background .18s,border-color .18s}
.ws-task.chosen{border-color:#db4a7388;background:linear-gradient(110deg,#4d1730a6,#15121e)}
.ws-task.accepted{box-shadow:inset 2px 0 #ed6182}
.ws-task-pick{flex:1;min-width:0;display:flex;align-items:center;gap:10px;padding:0;border:0;border-radius:3px;background:none;text-align:left;color:#eee8f0;cursor:pointer}
.ws-task-icon{flex:none;display:grid;place-items:center;width:clamp(28px,3cqw,43px);height:clamp(28px,3cqw,43px);border:1px solid #ab43645e;border-radius:5px;color:#e77599;background:#511d3026;font-size:clamp(17px,1.8cqw,24px)}
.ws-task-words{display:flex;flex-direction:column;min-width:0;gap:4px}.ws-task-words strong{font-size:clamp(12px,1.05cqw,16px);line-height:1.15;font-weight:750;overflow-wrap:anywhere}.ws-task-words small{font-size:clamp(10px,.8cqw,12px);line-height:1.25;color:#ada7b7}
.ws-task-right{flex:none;display:flex;flex-direction:column;justify-content:center;align-items:stretch;gap:4px}
.ws-difficulty{text-align:center;color:#d4b580;font-size:clamp(8px,.7cqw,10px);line-height:1.1;font-weight:750;letter-spacing:.06em}
.ws-accept{min-height:32px;min-width:66px;padding:5px 8px;border:1px solid #ff698254;border-radius:4px;background:linear-gradient(#af264b,#851b3c);color:#fff;font-size:clamp(9px,.8cqw,12px);font-weight:800;letter-spacing:.04em;cursor:pointer;transition:background .15s,box-shadow .15s}
.ws-task.accepted .ws-accept{background:#33202c;color:#f4b6c9;border-color:#875268}
.ws-board-bottom{flex:none;margin:0;padding-top:8px;color:#b0a8b8;font-size:clamp(9px,.75cqw,11px);line-height:1.3;min-height:2.6em}
.ws-active-task{display:flex;gap:7px;align-items:center;flex:none;min-width:0;padding-top:8px;color:#eee2e9;font-size:clamp(9px,.8cqw,12px)}
.ws-active-task span{color:#df8ca6;font-size:clamp(8px,.6cqw,10px);letter-spacing:.07em;flex:none}.ws-active-task b{min-width:0;font-weight:700}
.ws-board-frame:has(.ws-active-task:not([hidden])) .ws-board-bottom{min-height:0;padding-top:4px;font-size:clamp(8px,.65cqw,10px)}
.ws-back{position:absolute;z-index:5;top:3%;right:2.5%;min-height:40px;display:flex;align-items:center;justify-content:center;gap:7px;padding:8px 12px;border:1px solid #a4536a66;border-radius:6px;background:#0d0a10dd;color:#e9e3e9;font-size:12px;font-weight:750;cursor:pointer}.ws-back svg{transform:rotate(180deg)}
.ws-pack{position:absolute;z-index:4;left:13%;top:80%;width:20%;height:12%;min-height:56px;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:5px;padding:8px 9px 8px 38px;transform:perspective(650px) rotateX(24deg) rotateZ(-3deg);border:1px solid #856151;border-radius:4px;background:repeating-linear-gradient(1deg,#ffffff03 0 1px,transparent 1px 4px),linear-gradient(135deg,#674d3e,#37251f 80%);box-shadow:0 5px 0 #221614,3px 11px 10px #000a,inset 0 0 0 2px #2c1e1a;color:#f1e5d7;cursor:pointer}
.ws-pack::before{content:'';position:absolute;inset:0 auto 0 20%;width:13%;background:linear-gradient(90deg,#ccb18a33,#ceb68d66,#ccb18a33);border-inline:1px solid #e0cba422;pointer-events:none}
.ws-pack-seal{position:absolute;left:12px;top:50%;translate:0 -50%;width:25px;height:29px;display:grid;place-items:center;background:#682b31;border:1px solid #ad7775;color:#ead7cd;font:bold 10px Georgia,serif}
.ws-pack-top{font-size:clamp(7px,.65cqw,10px);letter-spacing:.13em;color:#d6bfa7}.ws-pack strong{font-size:clamp(9px,.8cqw,12px);font-weight:800;letter-spacing:.03em;white-space:nowrap}.ws-pack-line{display:block;width:48px;height:6px;opacity:.45;background:repeating-linear-gradient(90deg,#e2c9aa 0 1px,transparent 1px 3px,#e2c9aa 3px 5px,transparent 5px 6px)}
.ws-order-panel{position:fixed;inset:0;margin:auto;width:min(440px,calc(100vw - 32px));max-height:calc(100dvh - 48px);overflow:auto;padding:20px;border:1px solid #92566c;border-radius:8px;background:linear-gradient(145deg,#24141e,#101118);color:#f3eaf1;box-shadow:0 18px 50px #000a;transform:perspective(1400px) rotateY(3deg)}
.ws-order-panel::backdrop{background:#050307b8;backdrop-filter:blur(3px)}
.ws-order-top{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:10px}.ws-order-top span{font-size:11px;font-weight:850;color:#e693aa;letter-spacing:.14em}.ws-order-top button{width:44px;height:44px;border:1px solid #59303f;border-radius:6px;background:#ffffff06;color:#fff;font-size:25px;cursor:pointer}.ws-order-panel strong{display:block;font-size:21px}.ws-order-panel p{margin:12px 0;color:#d7ced6;font-size:14px;line-height:1.5}.ws-order-panel small{color:#c7a0af;font-size:12px;line-height:1.4}
.ws-scene-note{position:absolute;bottom:1.5%;right:2%;font-size:8px;font-weight:700;letter-spacing:.13em;color:#e4c9d4;text-shadow:0 1px 3px #000;pointer-events:none}
.ws-pack[hidden],.ws-active-task[hidden]{display:none!important}
.vanta-workstation button:focus-visible,.ws-order-panel button:focus-visible{outline:2px solid #f2d5e0;outline-offset:3px}
@media(hover:hover){.ws-task:hover{border-color:#b3768c}.ws-accept:hover{background:#b42d55;box-shadow:0 0 12px #c6325733}.ws-pack:hover{filter:brightness(1.12)}.ws-back:hover{background:#311b29}}
@container(max-width:1150px){.ws-task-icon{display:none}.ws-board{width:48%}.ws-title-block h2{font-size:22px}.ws-board-frame{padding:12px}.ws-total{font-size:8px}.ws-task-words strong{font-size:12px}.ws-task-words small{font-size:10px}}
/* The portrait plate changes composition, never the proportions of its props. */
@container(max-aspect-ratio:1/1){
 .ws-stage-enter{--art-width:max(100cqw,56.2201cqh);--art-height:max(100cqh,177.8723cqw);--scale-top:calc(50cqh + var(--art-height)*.16);--board-top:58px;--mount:perspective(1600px) rotateY(4deg) rotateZ(.7deg)}
 .ws-scene{background-image:url('./assets/workstation-portrait-v4.png')}
 .ws-scale-clearance{left:calc(50% - var(--art-width)*.17);width:calc(var(--art-width)*.32);height:calc(var(--art-height)*.08)}
 .ws-board{left:4%;width:92%;height:min(51cqh,calc(var(--scale-top) - var(--board-top) - 24px))}
 .ws-board-head{padding-bottom:8px;gap:5px}.ws-eyebrow{font-size:8px;letter-spacing:.1em}.ws-title-block h2{font-size:21px}.ws-total{font-size:8px}.ws-task{padding:6px 8px;gap:7px}.ws-task-list{gap:6px}.ws-task-words strong{font-size:12px}.ws-task-words small{font-size:10px}.ws-difficulty{font-size:8px}.ws-accept{font-size:9px;min-height:34px;min-width:63px}
 .ws-board-bottom{font-size:10px;padding-top:7px}.ws-active-task{font-size:10px;padding-top:7px}.ws-active-task span{font-size:8px}
 .ws-back{top:10px;right:4%;font-size:11px;min-height:36px;padding:6px 10px}
 .ws-pack{left:6%;top:83%;width:42%;height:10%;min-height:50px;padding-left:28px;gap:3px}.ws-pack-seal{left:8px;width:20px;height:24px;font-size:8px}.ws-pack-top{font-size:7px;letter-spacing:.04em}.ws-pack strong{font-size:9px}.ws-pack-line{height:4px;width:35px}.ws-scene-note{font-size:7px;bottom:2%}
}
@container(max-aspect-ratio:1/1) and (max-height:580px){
 .ws-stage-enter{--board-top:53px}.ws-board-frame{padding:10px}.ws-board-head{padding-bottom:6px}.ws-title-block h2{font-size:18px}.ws-task-list{gap:5px}.ws-task{padding:4px 6px}.ws-task-words{gap:2px}.ws-task-words strong{font-size:11px}.ws-task-words small{font-size:9px}.ws-task-right{gap:3px}.ws-accept{min-height:30px;min-width:59px;font-size:8px}.ws-board-bottom{font-size:9px;min-height:0;padding-top:5px}.ws-active-task{padding-top:5px;font-size:9px}.ws-board-frame:has(.ws-active-task:not([hidden])) .ws-board-bottom{display:none}
}
/* On very short screens the terminal sits left of, rather than above, the scale. */
@container(min-aspect-ratio:2/1) and (max-height:500px){
 .ws-stage-enter{--board-top:6cqh;--mount:perspective(1800px) rotateY(5deg) rotateZ(.5deg)}
 .ws-board{left:2%;width:37%;height:88%}.ws-board-frame{padding:9px}.ws-board-head{padding-bottom:5px}.ws-eyebrow{font-size:7px;letter-spacing:.07em}.ws-title-block h2{font-size:17px}.ws-total{font-size:7px}.ws-task-list{gap:4px}.ws-task{padding:4px 5px;gap:5px}.ws-task-words strong{font-size:10px}.ws-task-words small{font-size:8px}.ws-task-right{gap:3px}.ws-difficulty{font-size:7px}.ws-accept{min-height:26px;font-size:8px;min-width:55px;padding:4px}.ws-board-bottom{font-size:8px;padding-top:5px}.ws-active-task{font-size:8px;padding-top:5px}.ws-active-task span{font-size:7px}.ws-board-frame:has(.ws-active-task:not([hidden])) .ws-board-bottom{display:none}
 .ws-back{min-height:32px;font-size:10px;padding:5px 8px;top:4%;right:2%}.ws-pack{left:75%;top:81%;width:22%;height:14%;min-height:38px;padding:4px 6px 4px 24px;gap:2px}.ws-pack-top,.ws-pack-line{display:none}.ws-pack strong{font-size:9px}.ws-pack-seal{left:7px;width:17px;height:21px;font-size:7px}.ws-scene-note{display:none}
}
@media(max-width:730px){
 .bn-exact-app.ws-mode .main-pane{padding-bottom:calc(66px + var(--vanta-safe-bottom,0px))}
 .bn-exact-app.ws-mode .topbar-left{display:flex;flex:1;min-width:0}.bn-exact-app.ws-mode .breadcrumb{display:flex;max-width:none;white-space:normal;overflow:visible}.bn-exact-app.ws-mode .breadcrumb b{display:block;font-size:12px;letter-spacing:0}.bn-exact-app.ws-mode .bn-mobile-crumb,.bn-exact-app.ws-mode .bn-desktop-crumb,.bn-exact-app.ws-mode .bn-crumb-chevron{display:none}
}
@media(min-width:731px) and (max-width:1050px) and (max-height:500px){
 .bn-exact-app.ws-mode .desktop-sidebar{display:none}.bn-exact-app.ws-mode .main-pane{margin-left:0;padding-bottom:calc(52px + var(--vanta-safe-bottom,0px))}
 .bn-exact-app.ws-mode .mobile-tabs{position:fixed;display:grid;grid-template-columns:repeat(5,1fr);top:calc(var(--vanta-viewport) - 52px - var(--vanta-safe-bottom,0px));left:var(--vanta-safe-left,0px);right:var(--vanta-safe-right,0px);height:calc(52px + var(--vanta-safe-bottom,0px));padding:4px 3px var(--vanta-safe-bottom,0px);background:#120c12;border-top:1px solid #46303e;z-index:50}
 .bn-exact-app.ws-mode .mobile-tabs button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;min-width:0;border:0;background:none;color:#c5b8c2;font-size:9px}.bn-exact-app.ws-mode .mobile-tabs button.active{color:#ff648b}
}
.bn-exact-app .dd-job-btn.dd-primary:not(:disabled){cursor:pointer;box-shadow:0 12px 28px #ff194938}
/* Final compact sizing keeps controls readable without entering the scale area. */
@container(max-aspect-ratio:1/1) and (max-height:580px){.ws-board{height:min(55cqh,calc(var(--scale-top) - var(--board-top) - 18px))}}
@container(min-aspect-ratio:2/1) and (max-height:500px){.ws-title-block h2{font-size:clamp(14px,2cqw,17px);white-space:nowrap}}
/* A mounted terminal powers on in place; its physical frame never flies or scales. */
.is-opening .ws-board-frame{animation:ws-display-power .45s ease-out both}
.is-opening .ws-board-frame::before{animation:ws-light-power .35s ease-out both}
.is-opening .ws-board-head{animation:ws-content-power .28s .14s ease-out backwards}
.is-opening .ws-task{animation:ws-content-power .28s calc(.23s + var(--row)*.09s) ease-out backwards}
.is-opening .ws-board-bottom{animation:ws-content-power .25s .48s ease-out backwards}
.ws-pack.visible{animation:ws-parcel-settle .32s cubic-bezier(.2,.8,.3,1) backwards}
.ws-order-panel[open]{animation:ws-details-open .18s ease-out backwards}
@keyframes ws-display-power{from{background-color:#06070a;box-shadow:inset 0 0 0 1px #86717d22,inset 0 0 0 5px #06070aaa,-4px 7px 9px #000b}to{background-color:#141018}}
@keyframes ws-light-power{from{opacity:.12}to{opacity:1}}
@keyframes ws-content-power{from{opacity:0;translate:0 2px}to{opacity:1;translate:0 0}}
@keyframes ws-parcel-settle{from{opacity:0;translate:0 -6px}to{opacity:1;translate:0 0}}
@keyframes ws-details-open{from{opacity:0;translate:0 5px}to{opacity:1;translate:0 0}}
@media(prefers-reduced-motion:reduce){.vanta-workstation *,.vanta-workstation *::before,.vanta-workstation *::after,.ws-order-panel[open]{animation:none!important;transition:none!important}}