:root{font-family:'DM Sans',Arial,sans-serif;background:#171b17;color:#eee7d4;font-synthesis:none}*{box-sizing:border-box}html,body,#app{margin:0;width:100%;height:100%;overflow:hidden}button,input,select{font:inherit}button{cursor:pointer}button:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid #e6bf83;outline-offset:3px}#viewport{position:fixed;inset:0}canvas{display:block;touch-action:none}.grain{position:fixed;inset:0;z-index:2;pointer-events:none;opacity:.19;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 160 160' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.86' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' opacity='.23' filter='url(%23noise)'/%3E%3C/svg%3E")}.topbar{pointer-events:none;position:fixed;left:0;top:0;right:0;z-index:5;display:flex;align-items:center;justify-content:space-between;padding:28px 36px;border-bottom:1px solid #f5f0e01d;background:linear-gradient(#1419159a,transparent)}.brand{display:flex;align-items:center;gap:22px}.brandmark{font-size:28px;font-weight:700;letter-spacing:.15em;color:#f2d5a5}.brandmark span{font-size:16px;margin:0 2px;color:#d19762}.brand-caption,.top-caption{font-size:9px;letter-spacing:.23em;font-weight:600;color:#dad5c5a6}.brand-caption i{font-style:normal;color:#af794c}.top-caption b{color:#ca9062;padding:0 8px}.icon-button{pointer-events:auto;border:1px solid #c5c1b04e;width:35px;height:35px;border-radius:100%;background:#121b17a8;color:#eee9d9}.hero{pointer-events:none;position:fixed;z-index:3;left:clamp(25px,4vw,76px);top:clamp(115px,22vh,220px);width:min(510px,36vw)}.eyebrow{font-size:10px;font-weight:700;letter-spacing:.32em;color:#e5b87e}.eyebrow-line{display:inline-block;width:28px;margin:0 8px 3px;border-bottom:1px solid #c7a075}.hero h1{font-family:'Playfair Display',Georgia,serif;font-size:clamp(40px,4.6vw,80px);letter-spacing:-.046em;line-height:.98;font-weight:500;text-shadow:0 5px 25px #171a17a0;margin:16px 0 21px}.hero em{color:#e2b67c;font-weight:400}.hero-desc{font-size:13px;line-height:1.9;max-width:345px;color:#ddd8c9c7}.hero-rule{margin:29px 0 17px;width:185px;height:1px;background:#eee1c25c}.micro-label{font-size:9px;letter-spacing:.27em;color:#e5cfad80}.micro-label span{font-size:17px;margin-left:10px;color:#e6bd82}.right-rail{pointer-events:none;position:fixed;z-index:4;right:390px;top:20%;display:flex;align-items:center;gap:15px;writing-mode:vertical-rl}.vertical-text,.rail-marker{font-size:9px;letter-spacing:.3em;color:#f0dbb586}.vertical-text span{padding:10px;color:#d69b5a}.rail-marker{color:#d6ad76}.workshop-panel{position:fixed;z-index:6;right:0;top:0;height:100%;width:360px;background:#171c19ed;backdrop-filter:blur(24px);border-left:1px solid #f2deaf26;padding:101px 27px 24px;overflow:auto;box-shadow:-30px 0 90px #08110c4a;scrollbar-width:thin;scrollbar-color:#7e6b50 transparent}.panel-top,.panel-title-row,.range-head,.toggle-row,.panel-footer{display:flex;align-items:center;justify-content:space-between}.panel-kicker,.section-index,.small-hint{font-size:10px;letter-spacing:.18em;font-weight:700;color:#daa973}.panel-kicker b{font-size:9px;font-weight:600;color:#ede0c1;border:1px solid #bc9a6f5c;border-radius:20px;padding:4px 6px;margin-left:5px}.live{color:#a5b8a0;font-size:8px;letter-spacing:.09em;font-weight:700}.live i{display:inline-block;border-radius:50%;background:#99c694;width:5px;height:5px;margin-right:5px;box-shadow:0 0 10px #a1d59b}.workshop-panel h2{font-family:'Playfair Display',Georgia,serif;font-weight:400;letter-spacing:-.03em;font-size:32px;margin:19px 0 9px}.panel-copy{font-size:11px;line-height:1.8;color:#e9dfc6a0}.section-divider{height:1px;background:#decba327;margin:24px 0 19px}.small-hint{font-size:8px;color:#877f6f}.btn-row{display:flex;gap:8px;margin-top:17px}.primary-btn{flex:1;background:#dbb17a;color:#201d18;border:1px solid #dcba91;min-height:42px;text-align:center;font-size:10px;font-weight:700;letter-spacing:.12em;transition:background .2s}.primary-btn:hover{background:#f2c791}.square-btn{background:#2b3028;color:#deb883;border:1px solid #625747;width:43px}.range-head{margin-top:19px;margin-bottom:7px}.range-head label,.toggle-row label{font-size:9px;letter-spacing:.12em;color:#d5ccbb;font-weight:700}.range-head output{font-size:10px;color:#d4b182}input[type=range]{width:100%;height:3px;accent-color:#deb17a;cursor:pointer;margin:8px 0 4px}.segmented{display:flex;margin-top:15px;border:1px solid #d4bf9b3a;padding:3px;gap:3px}.segmented button{border:0;background:transparent;color:#beb29f;flex:1;min-height:33px;font-size:9px;letter-spacing:.06em}.segmented button.active{background:#dbc19d;color:#211e17;font-weight:700}select{width:100%;height:38px;border:1px solid #766d59;background:#282e27;color:#ebddc5;padding:0 12px;font-size:11px}.micro-note{font-size:10px;line-height:1.6;color:#999589;margin:10px 0}.toggle-row{margin:15px 0}.toggle-row input{accent-color:#dba96d;cursor:pointer}.view-buttons{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px;margin:17px 0}.view-buttons button{color:#b7ad98;border:1px solid #9b8b6a4e;background:transparent;min-height:42px;font-size:8px;line-height:1.4;letter-spacing:.05em}.view-buttons button.active{border-color:#deaf74;color:#eacda6;background:#c3a3731a}.panel-footer{gap:8px;padding-top:13px}.panel-footer button{flex:1;color:#c7b8a1;background:transparent;border:0;text-align:left;font-size:9px;letter-spacing:.12em}.panel-footer button:last-child{text-align:right}.view-label{pointer-events:none;position:fixed;z-index:5;left:clamp(25px,4vw,76px);bottom:70px;display:flex;align-items:center;gap:12px;font-size:10px;letter-spacing:.17em;color:#f0dcc2}.view-label b{color:#d9ad74}.crosshair{font-size:23px;color:#e4b981}.view-label #display-status{color:#c7b28f9c}.control-note{position:fixed;z-index:5;bottom:25px;left:clamp(25px,4vw,76px);font-size:9px;letter-spacing:.17em;color:#f6e7cf7a}.control-note span{color:#f0bd81;padding:0 7px}.tooltip{pointer-events:none;position:fixed;z-index:9;background:#e7d2a8;color:#1a211a;max-width:215px;font-size:10px;padding:10px 13px;letter-spacing:.05em;box-shadow:0 6px 18px #1118}.modal-backdrop{position:fixed;inset:0;z-index:30;background:#070a08a6;display:grid;place-items:center;padding:20px}.modal-backdrop[hidden]{display:none}.modal{width:min(480px,100%);background:#1e2922;border:1px solid #d4aa7180;padding:34px 39px;box-shadow:0 40px 150px #050907d9;position:relative}.modal h2{font-family:'Playfair Display',serif;font-size:37px;line-height:1.15;font-weight:400}.modal p{color:#e5d6c0;line-height:1.8;font-size:13px}.modal .modal-notation{color:#b4a18a;font-size:11px;border-top:1px solid #d8ba7a30;padding-top:19px}.modal-close{position:absolute;right:17px;top:15px;background:transparent;color:#e9d6b1;border:0}.modal-action{background:#c4a074;border:0;color:#1c211c;padding:12px 19px;font-size:10px;font-weight:700;letter-spacing:.15em;margin-top:8px}.loading{position:fixed;z-index:50;inset:0;background:#111c17;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:20px;transition:opacity .65s}.loading.dismiss{opacity:0;pointer-events:none}.loading-name{font-family:'Playfair Display',Georgia,serif;font-size:clamp(25px,3.5vw,48px);color:#e9c38d;letter-spacing:.03em}.loading-name span{color:#8d7451}.loading p{font-size:9px;letter-spacing:.3em;color:#b9a587}.loading-line{width:200px;height:2px;background:#656750}.loading-line i{display:block;width:100%;height:100%;background:#e0b478;transform-origin:left;animation:load .9s ease-in-out infinite alternate}@keyframes load{from{transform:scaleX(.1)}to{transform:scaleX(1)}}.toast{position:fixed;z-index:25;bottom:100px;left:50%;transform:translateX(-50%);background:#e0bc83;color:#1c1d18;padding:12px 18px;font-size:12px}.toast[hidden]{display:none}
@media (max-width:1100px){.hero{top:115px;width:35vw}.hero h1{font-size:45px}.right-rail{display:none}.workshop-panel{width:315px;padding:94px 20px 25px}.hero-desc{max-width:260px;font-size:11px}.top-caption{display:none}}
@media (max-width:700px){#app{overflow:hidden}.topbar{padding:17px 20px}.brand-caption{display:none}.brandmark{font-size:23px}.hero{left:20px;top:76px;width:calc(100% - 40px)}.hero h1{font-size:clamp(34px,8vw,58px);margin:8px 0 9px}.hero-desc{font-size:11px;max-width:245px;line-height:1.5}.hero-rule,.micro-label{display:none}.eyebrow{font-size:8px}.workshop-panel{top:auto;bottom:0;width:100%;height:min(46%,380px);border-left:0;border-top:1px solid #d2b0804f;padding:16px 20px 24px;border-radius:16px 16px 0 0;background:#171c19f2}.panel-top,.workshop-panel h2,.panel-copy{display:none}.section-divider{margin:14px 0}.workshop-panel .section-divider:first-of-type{display:none}.view-label{bottom:calc(min(46%,380px) + 18px);left:20px;max-width:calc(100vw - 40px);font-size:8px}.view-label #display-status{display:none}.control-note{display:none}.panel-footer{padding-bottom:10px}}
@media(prefers-reduced-motion:reduce){.loading-line i{animation:none}.loading{transition:none}}