:root{--sage:#deebcf;--ink:#11130f;--muted:#a4a79e}html{scroll-behavior:smooth}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit}button,a{touch-action:manipulation}button:focus-visible,a:focus-visible{outline:2px solid #99b67f;outline-offset:5px}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}.demo-button{display:inline-flex;align-items:center;justify-content:center;gap:26px;padding:17px 23px;border:1px solid transparent;border-radius:5px;background:var(--sage);color:#20271b;font-size:14px;font-weight:500;line-height:1.25;transition:background .2s,transform .2s}.demo-button:hover{background:#eef5e4;transform:translateY(-2px)}.demo-button svg{width:17px;height:17px;flex-shrink:0}.cover-actions{position:absolute;top:84%;left:6.80556%;display:flex;align-items:center;gap:30px}.cover-actions .demo-button{font-size:clamp(12px,1.03vw,15px);padding:15px 20px;gap:22px}.story-link{font-size:13px;color:#ddd;display:flex;gap:18px;align-items:center}.story-link:hover{color:#fff}.cover-note{position:absolute;left:6.80556%;top:94%;font-size:11px;color:#b5b5b5}.experience{padding:100px 6.80556% 38px;background:#11130f;color:#fff;scroll-margin-top:25px}.experience-heading{display:flex;gap:8%;align-items:flex-end;justify-content:space-between;margin-bottom:48px}.eyebrow{font-size:10px;letter-spacing:1.8px;line-height:1.6;color:#c7d5bb;margin:0 0 22px;display:flex;align-items:center;gap:9px}.status-dot{display:inline-block;width:6px;height:6px;border-radius:50%;background:#b8d49a;flex-shrink:0}.experience h2{font-size:clamp(35px,4.3vw,66px);line-height:1.09;font-weight:500;letter-spacing:-2.2px;margin:0}.experience-intro{width:36%;max-width:370px;flex-shrink:0}.experience-intro>p{font-size:14px;line-height:1.8;color:#b7bbb1;margin:0 0 23px}.entry-hint{display:block;color:#888e80;font-size:10px;margin-top:12px}.preview-shell{border:1px solid #3e4437;border-radius:10px;overflow:hidden;background:#262a22;box-shadow:0 18px 60px #0003}.preview-toolbar{display:flex;justify-content:space-between;align-items:center;padding:14px 22px;gap:15px;color:#cbd0c2}.preview-toolbar>span{display:flex;align-items:center;gap:10px;font-size:10px;letter-spacing:1px;flex-wrap:wrap}.toolbar-divider{color:#66705c;margin:0 5px}#preview-label{letter-spacing:0;font-size:11px;color:#a8afa0}.expand-preview{border:0;background:none;color:#cbd0c2;display:flex;align-items:center;gap:10px;font-size:11px;cursor:pointer;padding:7px;white-space:nowrap}.expand-preview:hover{color:white}.expand-preview svg{width:14px;height:14px}.preview-image-wrap{position:relative;aspect-ratio:1920/1074;background:#262a22;overflow:hidden}.preview-image-wrap>img{width:100%;height:100%;object-fit:cover;display:block;transition:opacity .15s}.preview-badge{position:absolute;bottom:15px;right:18px;background:#191d18d9;backdrop-filter:blur(8px);padding:8px 11px;border-radius:4px;letter-spacing:1.2px;font-size:8px;color:#d4dbc9;pointer-events:none}.experience-tabs{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;margin-top:30px}.experience-tabs button{cursor:pointer;display:flex;align-items:center;gap:12px;background:none;border:0;border-top:1px solid #3a4034;text-align:left;color:#8f9686;padding:23px 0 9px;font-size:14px;line-height:1.5;transition:color .2s,border-color .2s}.experience-tabs button>span:first-child{font-size:10px;color:#7b856e}.experience-tabs button>span:last-child{margin-left:auto;opacity:.3}.experience-tabs button[aria-selected=true]{color:#e4efd9;border-color:#c6daa9}.experience-tabs button[aria-selected=true]>span{color:#c6daa9;opacity:1}.experience-tabs button:hover{color:white}.experience-detail{display:flex;gap:40px;justify-content:space-between;min-height:100px;margin-top:12px}.experience-detail>p{font-size:13px;line-height:1.8;color:#a5ad9a;margin:0;max-width:52%}.experience-detail>.scene-instruction{font-size:11px;max-width:39%;color:#adb8a0}.scene-instruction span{font-size:9px;letter-spacing:1px;display:block;margin-bottom:4px;color:#d3dfc5}.experience-foot{display:flex;align-items:center;justify-content:space-between;border-top:1px solid #30372b;padding-top:25px;gap:30px}.experience-foot p{font-size:10px;color:#838c7a;line-height:1.6;margin:0}.experience-foot a{font-size:11px;flex-shrink:0;color:#cfd9c4}.experience-foot a span{margin-left:16px}.solution-cta{display:flex;align-items:center;gap:22px}.solution-cta span{font-size:12px;color:#9ca591}.ds-solution{grid-template-rows:auto auto minmax(0,1fr);height:100svh}.solution-cta .demo-button{font-size:12px;padding:13px 18px}.floating-entry{position:fixed;bottom:24px;right:28px;padding:9px 9px 9px 22px;border:1px solid #5b6652;background:#1c221af2;backdrop-filter:blur(20px);border-radius:9px;display:flex;align-items:center;gap:26px;z-index:15;color:#e3eadc;box-shadow:0 5px 30px #0004}.floating-entry[hidden]{display:none}.floating-entry>span{font-size:10px;font-weight:600;letter-spacing:1px}.floating-entry small{display:block;font-size:10px;letter-spacing:0;font-weight:400;color:#a5af9b;margin-top:4px}.floating-entry .demo-button{font-size:12px;padding:13px 17px;gap:18px}.preview-footer{display:flex;align-items:center;justify-content:space-between;padding:24px 6.80556%;gap:25px;color:#6c7365;border-top:1px solid #e7eae3;background:#fff}.preview-footer>span{font-size:9px;letter-spacing:1.2px}.preview-footer a{display:flex;align-items:center;gap:12px;font-size:11px}.preview-footer svg{width:14px;height:14px}dialog{width:min(1200px,94vw);max-height:94svh;margin:auto;padding:0;border:1px solid #62695c;border-radius:12px;background:#22271f;color:white;box-shadow:0 30px 120px #0008}dialog::backdrop{background:#10150fbb;backdrop-filter:blur(12px)}.lightbox-header,.lightbox-footer{display:flex;justify-content:space-between;align-items:center;padding:15px 22px;gap:20px}.lightbox-header h2{font-size:14px;font-weight:500;margin:0}.lightbox-close{background:none;border:1px solid #575f4e;color:white;border-radius:50%;width:36px;height:36px;cursor:pointer}.lightbox-close:hover{background:#454d3e}#lightbox-image{width:100%;max-height:72svh;object-fit:contain;display:block;background:#131610}.lightbox-footer>span{font-size:11px;color:#a9b39c}.lightbox-footer .demo-button{font-size:12px;padding:12px 16px}body:has(dialog[open]){overflow:hidden}
@media(min-width:1600px){.experience{padding-left:max(6.80556%,calc((100vw - 1400px)/2));padding-right:max(6.80556%,calc((100vw - 1400px)/2))}}@media(max-width:900px){.cover-actions{gap:18px}.cover-actions .demo-button{padding:12px 16px;gap:12px}.story-link{font-size:11px;gap:8px}.experience{padding-top:70px}.experience-heading{gap:5%}.experience h2{letter-spacing:-1.4px}.experience-intro{width:40%}.experience-intro>p{font-size:12px}.experience-intro .demo-button{font-size:12px;padding:14px 16px;gap:15px}.experience-tabs{gap:18px}.experience-tabs button{font-size:12px;gap:8px}.experience-detail{gap:20px}.experience-detail>p{font-size:12px}.experience-detail>.scene-instruction{font-size:10px}.cover-note{font-size:9px}}
@media(max-width:600px){.ds-cover{height:680px;max-height:none;container-type:normal}.ds-cover-scene{top:0;width:165%;left:-45%;height:450px;object-fit:cover;object-position:center top;opacity:.8}.ds-cover-shade{left:0;top:0;width:100%;height:100%;background:linear-gradient(0deg,#000 18%,#0000 90%)}.ds-cover h1{top:345px;left:7%;font-size:46px;line-height:1.03;letter-spacing:-1px}.ds-cover-description{top:455px;left:7%;font-size:13px;line-height:1.6;max-width:83%}.ds-cover-meta{top:515px;left:7%;font-size:10px;white-space:normal;max-width:86%;line-height:1.5}.cover-actions{top:554px;left:7%;right:7%;gap:18px;flex-wrap:wrap}.cover-actions .demo-button{font-size:12px;padding:14px 17px}.story-link{font-size:10px}.cover-note{top:622px;left:7%;font-size:10px}.experience{padding:55px 6% 28px}.experience-heading{display:block;margin-bottom:30px}.eyebrow{font-size:9px;letter-spacing:1.2px;margin-bottom:18px}.experience h2{font-size:38px;line-height:1.12;letter-spacing:-1.5px}.experience-intro{width:100%;margin-top:25px;max-width:100%}.experience-intro>p{font-size:13px;margin-bottom:20px}.experience-intro .demo-button{font-size:13px}.entry-hint{font-size:9px}.preview-toolbar{padding:9px 10px;gap:3px}.preview-toolbar>span{font-size:8px;gap:6px}.toolbar-divider,#preview-label{display:none}.expand-preview{font-size:9px;gap:6px}.preview-shell{border-radius:6px}.preview-badge{display:none}.experience-tabs{gap:12px;margin-top:23px}.experience-tabs button{font-size:11px;line-height:1.5;display:block;padding-top:14px}.experience-tabs button>span:first-child{display:block;margin-bottom:8px;font-size:9px}.experience-tabs button>span:last-child{display:none}.experience-detail{display:block;margin:14px 0 25px;min-height:150px}.experience-detail>p{max-width:none;font-size:12px}.experience-detail>.scene-instruction{max-width:none;font-size:11px;margin-top:17px}.experience-foot{display:block;padding-top:20px}.experience-foot p{font-size:10px;max-width:280px;margin-bottom:17px}.solution-cta{gap:12px;flex-wrap:wrap}.solution-cta span{font-size:10px}.ds-solution{height:auto;min-height:0;gap:20px;padding:30px 5%}.floating-entry{bottom:12px;right:12px;left:12px;justify-content:space-between;padding-left:15px;gap:12px}.floating-entry .demo-button{padding:12px 15px}.preview-footer{display:block;padding:25px 6% 95px}.preview-footer>span{display:block;margin-bottom:14px}.lightbox-header,.lightbox-footer{padding:12px;gap:10px}.lightbox-footer>span{font-size:9px;max-width:110px}.lightbox-footer .demo-button{font-size:11px;padding:12px;gap:12px}}
@media(max-width:600px){.ds-cover{height:720px}.cover-actions{flex-direction:column;align-items:flex-start;gap:16px}.cover-note{top:676px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition:none!important;animation:none!important}}

/* The original black project credits close the entire page. */
.project-footer{background:#000;color:#fff;text-align:center;padding:54px 24px 52px}.project-footer h2{font-size:clamp(28px,3.5vw,64px);line-height:1.15;letter-spacing:-1px;font-weight:500;margin:0 0 28px}.project-footer p{font-size:clamp(11px,1.15vw,18px);line-height:1.6;color:#c8c8c8;margin:5px 0}.project-footer p span{padding:0 9px}@media(max-width:600px){.project-footer{padding:42px 18px}.project-footer h2{margin-bottom:22px}.project-footer p span{padding:0 5px}}

/* All preview scenes share one native desktop frame; no portrait letterboxing. */
#experience-image{aspect-ratio:1920/1074}
#preview-dialog{width:min(1800px,96vw,calc((94svh - 150px)*1.78771));max-height:94svh}
.lightbox-actions{display:flex;align-items:center;gap:12px}
.lightbox-zoom{font-size:11px;color:#dce6d1;background:#dce6d10b;border:1px solid #dce6d12c;padding:9px 12px;border-radius:6px;cursor:pointer;white-space:nowrap}
.lightbox-zoom:hover{background:#dce6d11c}
.lightbox-zoom[aria-pressed=true]{background:var(--sage);color:var(--ink)}
.lightbox-media{overflow:auto;max-height:calc(94svh - 150px);overscroll-behavior:contain;scrollbar-color:#a0ab93 #22271f}
.lightbox-media:focus-visible{outline:2px solid #b8d49a;outline-offset:-2px}
#lightbox-image{width:100%;height:auto;max-height:none;object-fit:initial;background:none}
#preview-dialog.is-zoomed{width:min(1800px,96vw)}
#preview-dialog.is-zoomed #lightbox-image{width:1920px;max-width:none;height:auto}
@media(max-width:600px){.lightbox-actions{gap:8px}.lightbox-zoom{font-size:10px;padding:8px 9px}.lightbox-header h2{font-size:12px}}

/* Keep the original gentle cover/solution scroll snapping in cover.css. */
.ds-case-after{aspect-ratio:1440 / 407}
