@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Libre+Caslon+Display&display=swap');:root{--navy:#102337;--cream:#f4eedf;--gold:#d4b77b;--mint:#8bd3b0}*{box-sizing:border-box}body{margin:0;overflow:hidden;background:#bdd1cb;color:var(--cream);font:14px 'DM Sans',sans-serif;height:100dvh}button{font:inherit;cursor:pointer;min-width:44px;min-height:44px;border:1px solid #ffffff25;border-radius:12px;background:#183149;color:var(--cream);padding:10px 16px;touch-action:manipulation}button:hover{border-color:var(--gold)}button:disabled{opacity:.45;cursor:default}button:focus-visible,input:focus-visible{outline:3px solid var(--mint);outline-offset:3px}[hidden]{display:none!important}#scene{position:absolute;inset:0}#scene canvas{display:block;touch-action:none;width:100%;height:100%}header{position:absolute;top:0;left:0;right:0;height:85px;display:flex;align-items:center;justify-content:space-between;padding:20px 32px;background:linear-gradient(#102337f5,#102337c0);z-index:2}.brand{display:flex;gap:12px;align-items:center;font-size:35px}.brand span{font:25px 'Libre Caslon Display',Georgia,serif}.brand small{display:block;font:8px 'DM Sans';letter-spacing:5px;color:var(--gold);margin-top:3px}.wallet{color:var(--gold);font-size:16px}.wallet small{display:block;font-size:9px;text-align:right;color:#aec0c8}.topline{position:absolute;left:32px;right:32px;top:108px;display:flex;justify-content:space-between;align-items:start;pointer-events:none;color:var(--navy)}.eyebrow{font-size:9px;letter-spacing:2px;color:var(--gold)}.topline .eyebrow{color:#425d55}h1{font:36px 'Libre Caslon Display',Georgia,serif;margin:8px 0}#status{font-size:11px;background:#102337db;color:var(--mint);border-radius:20px;padding:10px 14px}.sceneTag{position:absolute;left:32px;top:195px;border-radius:20px;background:#102337cc;padding:9px 14px;font-size:11px;pointer-events:none}.sceneTag span{color:var(--mint);margin:0 7px}.camera{position:absolute;right:24px;top:40%;display:flex;flex-direction:column;gap:8px}.camera button{background:#102337e8;font-size:23px;padding:3px;width:46px;box-shadow:0 5px 14px #10233720}#hint{position:absolute;bottom:125px;left:50%;transform:translateX(-50%);font-size:10px;letter-spacing:1px;color:#203e37;background:#eff4e9c9;padding:8px 14px;border-radius:20px;white-space:nowrap;pointer-events:none}#shopCard{position:absolute;left:28px;bottom:28px;width:340px;padding:24px;background:#102337ed;backdrop-filter:blur(15px);border:1px solid #ffffff30;border-radius:24px;box-shadow:0 15px 60px #10233725}.shopline{display:flex;justify-content:space-between;align-items:center;gap:12px}.shopline strong{color:var(--gold);white-space:nowrap;font-size:17px}h2{font:30px 'Libre Caslon Display',Georgia,serif;margin:12px 0}p{color:#b3c3cc;line-height:1.6;font-size:13px}.primary{background:var(--gold);color:var(--navy);font-weight:700;border:0;width:100%}.primary:hover{background:#e6c98d}small{font-size:10px;color:#9fb2be;display:block;text-align:center;margin-top:10px}#dock{position:absolute;bottom:max(22px,env(safe-area-inset-bottom));left:50%;transform:translateX(-50%);display:flex;gap:5px;background:#102337ed;border:1px solid #ffffff30;padding:8px;border-radius:22px;box-shadow:0 10px 35px #10233730;z-index:4}#dock button{background:transparent;border-color:transparent;font-size:23px;min-width:76px;padding:8px}#dock button span{display:block;font-size:10px;margin-top:5px}#dock button.active{background:#d4b77b22;border-color:#d4b77b70;color:var(--gold)}.showTools{position:absolute;bottom:25px;left:50%;transform:translateX(-50%);background:#102337ee;padding:14px 25px;border-radius:25px;z-index:4}#scrim{position:absolute;inset:85px 0 0;background:#1023370c;z-index:5}#popin{position:absolute;right:95px;top:50%;transform:translateY(-50%);width:340px;background:#102337f5;backdrop-filter:blur(18px);border:1px solid #ffffff30;border-radius:24px;padding:0 22px;z-index:6;box-shadow:0 20px 60px #10233735;max-height:75dvh;display:flex;flex-direction:column}#handle{padding:12px;display:flex;justify-content:center;touch-action:none}#handle span{width:42px;height:4px;background:#ffffff35;border-radius:5px}.panelhead{display:flex;justify-content:space-between;align-items:center;margin-bottom:5px}.panelhead h2{margin:6px 0;font-size:32px}.panelhead button{border:0;background:#ffffff08;font-size:26px;padding:2px}.panelFoot{display:flex;align-items:center;justify-content:space-between;padding:14px 0;border-top:1px solid #ffffff15;margin-top:12px}.panelFoot span{color:#9eb4c1;font-size:10px}.panelFoot button{background:var(--gold);color:var(--navy);border:0;font-weight:700}#panelBody{overflow:auto;overscroll-behavior:contain;padding-bottom:2px}.fieldlabel{color:#a9bdc8;font-size:11px;margin:14px 0 9px}.optionrow{display:flex;gap:7px}.optionrow button{flex:1;font-size:12px;padding:10px 5px}.optionrow button.selected{border-color:var(--mint);background:#8bd3b01a;color:var(--mint)}.colors{display:flex;gap:8px;flex-wrap:wrap}.colors button{min-width:44px;height:44px;padding:5px;background:transparent}.colors button span{display:block;height:30px;width:30px;border-radius:50%;border:1px solid #ffffff35}.colors button.selected{border:2px solid var(--mint)}.customColor{display:flex;gap:12px;align-items:center;color:#9fb6c4;font-size:11px;margin-top:12px}.customColor input{height:44px;width:54px;border:0;background:transparent;padding:0}.customColor code{font-size:11px;color:#c9d6de}.note{font-size:10px;color:#879fae;line-height:1.5;margin:14px 0 0}dialog{background:#152c40;color:var(--cream);border:1px solid #d4b77b66;border-radius:24px;width:min(420px,calc(100% - 30px));padding:30px}dialog::backdrop{background:#081522ab;backdrop-filter:blur(5px)}.close{position:absolute;right:10px;top:8px;border:0;background:none;font-size:25px}.receipt{display:flex;justify-content:space-between;gap:15px;font-size:12px;margin:20px 0}.receipt b{color:var(--gold)}.secondary{width:100%;margin-top:10px;background:transparent}#toast{position:absolute;left:50%;top:220px;transform:translateX(-50%);z-index:10;padding:14px 22px;background:var(--cream);color:var(--navy);border-radius:14px;box-shadow:0 10px 30px #10233730;display:none;font-size:12px;max-width:90%;text-align:center}@media(max-width:650px){header{height:73px;padding:12px 18px}.brand span{font-size:22px}.topline{top:91px;left:18px;right:18px}h1{font-size:28px;max-width:245px}.topline .eyebrow{font-size:8px}#status{padding:8px;font-size:9px}.sceneTag{top:174px;left:18px;font-size:10px}.camera{right:12px;top:37%;gap:6px}.camera button{height:44px;width:44px}.shopline h2{font-size:28px}#shopCard{left:12px;right:12px;bottom:max(12px,env(safe-area-inset-bottom));width:auto;padding:18px 20px}#shopCard p{margin:8px 0 14px}#dock{bottom:max(12px,env(safe-area-inset-bottom));width:calc(100% - 24px);gap:2px;padding:6px;justify-content:space-around;border-radius:20px}#dock button{min-width:0;flex:1;font-size:23px;padding:7px 3px}#dock button span{font-size:9px}#hint{bottom:108px;font-size:9px}#popin{top:auto;right:0;left:0;bottom:0;width:100%;transform:none;border-radius:26px 26px 0 0;max-height:48dvh;padding:0 20px max(6px,env(safe-area-inset-bottom))}#handle{padding:11px}.panelhead h2{font-size:28px}.panelhead{margin-bottom:0}.fieldlabel{margin-top:10px}.panelFoot{margin-top:8px;padding:10px 0}.panelFoot span{font-size:9px}#scrim{inset:73px 0 0}#toast{top:210px;width:max-content;max-width:90%}.showTools{bottom:max(15px,env(safe-area-inset-bottom))}}#modeSwitch{position:absolute;top:187px;left:50%;transform:translateX(-50%);display:flex;padding:4px;background:#102337ee;border-radius:18px;z-index:4;border:1px solid #ffffff25}#modeSwitch button{border:0;background:transparent;padding:10px 20px;font-size:12px}#modeSwitch button.active{background:var(--cream);color:var(--navy)}#objectTray{position:absolute;bottom:18px;left:50%;transform:translateX(-50%);width:min(540px,calc(100% - 24px));padding:14px 18px;background:#102337f5;backdrop-filter:blur(16px);border:1px solid #ffffff35;border-radius:24px;z-index:4;box-shadow:0 12px 40px #10233740}.trayHead{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}.trayHead b{font-size:13px}.trayHead small{text-align:left;margin-top:4px;font-size:9px}.trayHead button{padding:3px;font-size:24px;background:transparent;border:0}#objectCards{display:flex;gap:8px;overflow-x:auto;overscroll-behavior:contain;padding:2px}#objectCards button{min-width:78px;flex:1;padding:8px 4px;touch-action:none;user-select:none;-webkit-user-select:none;background:#1d3549}#objectCards button.active{border-color:var(--mint);background:#8bd3b017}#objectCards svg{display:block;width:45px;height:45px;margin:auto;pointer-events:none}#objectCards .itemlabel{display:block;font-size:10px;margin-top:5px;pointer-events:none}#objectCards .quantity{display:block;font-size:9px;color:var(--gold);margin-top:4px;pointer-events:none}#placementFeedback{font-size:10px;color:var(--mint);margin:10px 0;min-height:14px}#placementFeedback.invalid{color:#ef9b8f}#cancelPlacement{padding:5px 14px;font-size:11px;min-height:44px;background:transparent}#objectSelection{display:flex;align-items:center;gap:8px;margin-top:10px;border-top:1px solid #ffffff20;padding-top:8px}#objectSelection b{margin-right:auto;font-size:11px}#objectSelection button{font-size:10px;padding:8px}.placementActive #hint{bottom:auto;top:242px}.placementActive .sceneTag{display:none}.placementActive .camera{top:32%}@media(max-width:650px){#modeSwitch{top:170px}#modeSwitch button{padding:8px 18px;font-size:11px}#objectTray{bottom:max(8px,env(safe-area-inset-bottom));padding:10px 12px;border-radius:22px;max-height:38dvh;overflow-y:auto}.trayHead{margin-bottom:7px}.trayHead b{font-size:12px}#objectCards{gap:5px}#objectCards button{min-width:64px;padding:5px 2px}#objectCards svg{width:36px;height:36px}#objectCards .itemlabel{font-size:9px}#objectCards .quantity{font-size:8px}#placementFeedback{font-size:9px}.placementActive #hint{top:222px;font-size:8px}.placementActive .camera{top:30%}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto}}
