:root { color-scheme: light; --ink:#204b32; --muted:#60785d; --green:#2f8b36; --green-dark:#236c2c; --leaf:#a7d75d; --gold:#ffd34b; --line:#bddb8d; --cream:#fffdea; --panel:#f2f8dd; --shadow:0 4px 0 rgba(39,102,35,.22); font-family:Inter,"Trebuchet MS",Arial,sans-serif; }
* { box-sizing:border-box; }
[hidden] { display:none !important; }
body { min-width:320px; min-height:100vh; margin:0; color:var(--ink); background:radial-gradient(ellipse at 20% 0,#eff8c9 0,transparent 38%),linear-gradient(135deg,#e6f3b9,#cde995 45%,#b7df7a); }
button,input,select { font:inherit; }
button { cursor:pointer; }
.admin-shell { min-height:100vh; }
.topbar { position:sticky; z-index:5; top:0; display:flex; align-items:center; justify-content:space-between; min-height:72px; padding:12px clamp(18px,4vw,56px); color:white; background:linear-gradient(180deg,#48a93d,#2d882d); border-bottom:5px solid #216a26; box-shadow:0 3px 10px #316a2d40; }
.brand { display:flex; align-items:center; gap:10px; color:inherit; text-decoration:none; }
.brand-mark { display:grid; place-items:center; width:42px; height:42px; border:3px solid #fff8cb; border-radius:13px; color:#775914; background:var(--gold); box-shadow:0 3px 0 #bb861c; font-weight:1000; font-size:22px; }
.brand strong,.brand small { display:block; }.brand strong { font-size:16px; }.brand small { margin-top:2px; color:#dcf2ca; font-weight:700; font-size:11px; }
.topbar-right,.connection { display:flex; align-items:center; gap:12px; }.connection { color:#efffdc; font-size:12px; font-weight:800; }.connection i { width:9px; height:9px; border-radius:50%; background:#ffcf42; box-shadow:0 0 0 4px #fff3a82d; }.connection.is-connected i { background:#9df287; }
.auth-card { width:min(440px,calc(100% - 28px)); margin:clamp(55px,12vh,130px) auto; padding:30px; border:3px solid #fff; border-radius:22px; outline:2px solid #357f31; background:var(--cream); box-shadow:0 7px 0 #b7d36e,0 18px 50px #48762f35; }
.eyebrow { color:#97620d; font-weight:900; letter-spacing:.12em; font-size:10px; }.auth-card h1,.studio-heading h1 { margin:6px 0; font-size:clamp(25px,3vw,34px); letter-spacing:-.03em; }.auth-card>p,.studio-heading p { margin:8px 0 20px; color:var(--muted); line-height:1.5; font-size:13px; }
form { margin:0; }.auth-card form { display:grid; gap:12px; }.auth-card label,.editor-fields label,.image-card>label:not(.upload-button) { display:grid; gap:5px; color:var(--ink); font-size:12px; font-weight:800; }.auth-card input,.editor-fields input,.editor-fields select,.image-card input:not([type=file]) { width:100%; min-width:0; min-height:38px; padding:8px 10px; border:1px solid #adc97a; border-radius:9px; outline:none; color:#234833; background:#fff; box-shadow:inset 0 1px 2px #245c1a13; }.auth-card input:focus,.editor-fields input:focus,.editor-fields select:focus,.image-card input:focus { border-color:#459b3e; box-shadow:0 0 0 3px #78be5532; }
.primary,.secondary,.quiet { min-height:39px; padding:9px 14px; border:2px solid #256e2d; border-radius:11px; color:white; background:linear-gradient(#53b645,#308937); box-shadow:0 3px 0 #22662b; font-size:12px; font-weight:900; }.primary:hover { filter:brightness(1.05); }.primary:disabled { opacity:.55; cursor:wait; }.secondary { color:#356b33; border-color:#a9ca78; background:#f5f9e6; box-shadow:0 2px 0 #c4d69b; }.quiet { color:var(--ink); border-color:transparent; background:transparent; box-shadow:none; }.notice { min-height:18px; margin:4px 0 0!important; color:#9b451c!important; font-size:12px!important; font-weight:700; }.setup-note { padding:11px; border:1px solid #f0ca56; border-radius:10px; background:#fff7cf; }.setup-note p { margin:5px 0 8px; color:#6f6332; font-size:12px; line-height:1.4; }.setup-note code { display:block; padding:8px; overflow-wrap:anywhere; border-radius:6px; background:#fff; font-size:13px; letter-spacing:.08em; }
.studio { max-width:1560px; margin:0 auto; padding:clamp(16px,3vw,36px); }.studio-heading { display:flex; align-items:center; justify-content:space-between; gap:20px; margin:0 0 20px; }.studio-heading h1 { margin-top:4px; }.studio-heading p { margin:5px 0 0; }.new-item { white-space:nowrap; }
.workspace { display:grid; grid-template-columns:minmax(270px,340px) minmax(0,1fr); gap:16px; min-height:calc(100vh - 190px); }.catalog-panel,.editor-panel { min-width:0; border:2px solid #fff; border-radius:18px; outline:1px solid #8fbd5b; background:var(--cream); box-shadow:var(--shadow); }.catalog-panel { display:flex; flex-direction:column; max-height:calc(100vh - 190px); padding:12px; }.catalog-tools { display:grid; grid-template-columns:minmax(0,1fr) 124px; gap:7px; }.search-label { display:flex; align-items:center; gap:7px; padding:0 9px; border:1px solid var(--line); border-radius:9px; background:white; }.search-label span { color:#58983d; font-size:20px; }.search-label input { width:100%; min-width:0; height:36px; border:0; outline:0; background:transparent; }.catalog-tools select { min-width:0; padding:6px; border:1px solid var(--line); border-radius:9px; color:var(--ink); background:#fff; font-size:11px; }.furniture-list { display:grid; align-content:start; gap:7px; margin-top:11px; overflow:auto; }.furniture-row { display:grid; grid-template-columns:45px minmax(0,1fr) auto; align-items:center; gap:8px; width:100%; min-height:58px; padding:6px; border:1px solid #cadca4; border-radius:11px; color:var(--ink); background:#fbfdec; text-align:left; }.furniture-row:hover,.furniture-row[aria-current=true] { border-color:#53a542; background:#edf7d5; }.furniture-thumb { display:block; width:42px; height:42px; border:1px solid #d4e2b6; border-radius:9px; background:#f4f8e6 center/contain no-repeat; }.furniture-row strong,.furniture-row small { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }.furniture-row strong { font-size:12px; }.furniture-row small { margin-top:4px; color:var(--muted); font-size:10px; }.item-state { padding:4px 6px; border-radius:999px; color:#536f34; background:#e5f2c9; font-size:9px; font-weight:900; }.item-state.draft { color:#78450e; background:#ffecb1; }.list-note { margin:10px 2px 0; color:#77856c; font-size:10px; line-height:1.4; }
.editor-panel { padding:clamp(14px,2vw,24px); }.editor-heading { display:flex; align-items:center; justify-content:space-between; gap:12px; padding-bottom:13px; border-bottom:1px solid #dce9c2; }.editor-heading h2 { margin:5px 0 0; font-size:22px; }.publish-switch { display:flex; align-items:center; gap:7px; cursor:pointer; font-size:11px; }.publish-switch input { position:absolute; opacity:0; }.publish-switch span { position:relative; width:36px; height:20px; border-radius:999px; background:#c1c9b0; }.publish-switch span:after { position:absolute; top:3px; left:3px; width:14px; height:14px; border-radius:50%; background:white; content:""; transition:transform .15s; }.publish-switch input:checked+span { background:#48a53e; }.publish-switch input:checked+span:after { transform:translateX(16px); }
.editor-layout { display:grid; grid-template-columns:minmax(0,1.4fr) minmax(255px,.8fr); gap:17px; padding-top:14px; }.editor-fields { display:grid; align-content:start; gap:10px; }.field-section,.preview-card,.image-card { padding:12px; border:1px solid #cee0a7; border-radius:12px; background:#f8fbe9; }.field-section h3,.image-card h3 { margin:0; font-size:13px; }.field-grid { display:grid; gap:9px; margin-top:10px; }.field-grid.two { grid-template-columns:repeat(2,minmax(0,1fr)); }.field-grid.three { grid-template-columns:repeat(3,minmax(0,1fr)); }.field-grid small { color:#718466; font-weight:600; }.field-hint,.field-help { align-self:center; margin:0; color:#758467; font-size:10px; line-height:1.4; }.field-help { margin-top:8px; }.field-help.inline { align-self:end; padding-bottom:7px; }.check-field { display:flex!important; align-items:center; gap:7px!important; min-height:38px; padding:7px 9px; border:1px solid #d1e1b4; border-radius:9px; background:white; }.check-field input { width:16px; min-height:16px; height:16px; accent-color:#398f37; }.check-field span { color:#526d46; font-size:11px; }.check-field.compact { padding:4px 8px; min-height:30px; }.section-title { display:flex; align-items:center; justify-content:space-between; gap:8px; }.stock-readout { display:grid; grid-template-columns:1fr auto 1fr auto; align-items:center; gap:4px 8px; padding:7px; border:1px solid #dce7c2; border-radius:9px; background:#fff; color:#738264; font-size:10px; }.stock-readout strong { color:var(--ink); font-size:13px; }.preview-column { display:grid; align-content:start; gap:10px; }.preview-card { text-align:center; }.preview-stage { position:relative; display:grid; place-items:end center; height:190px; margin:10px 0 8px; overflow:hidden; border:1px solid #c9dda2; border-radius:11px; background:linear-gradient(180deg,#f5f8dc 0 62%,#c4e5a0 62% 65%,#bb8e55 65% 67%,#dca96d 67%); }.preview-floor { position:absolute; right:0; bottom:8%; left:0; height:20%; border-top:2px solid #ac7b43; background:repeating-linear-gradient(0deg,transparent 0 20px,#ba874e 21px 23px); opacity:.7; }.preview-art { position:absolute; z-index:2; bottom:14%; left:50%; width:58%; height:68%; transform:translateX(-50%); background-position:center bottom; background-repeat:no-repeat; background-size:contain; }.preview-duck { position:absolute; z-index:3; bottom:20%; left:50%; width:46px; height:64px; object-fit:contain; transform:translate(-50%,var(--duck-seat-y,0px)); filter:drop-shadow(0 2px 1px #382b1d55); }.preview-duck[hidden] { display:none; }.preview-card>strong,.preview-card>small { display:block; }.preview-card>strong { font-size:12px; }.preview-card>small { margin-top:4px; color:var(--muted); font-size:10px; }.image-card .section-title { margin-bottom:10px; }.image-status { max-width:110px; overflow:hidden; color:#658153; text-overflow:ellipsis; white-space:nowrap; font-size:9px; }.upload-button { display:flex; align-items:center; justify-content:center; min-height:38px; margin:0 0 9px; border:1px dashed #8eba61; border-radius:9px; color:#397735; background:#fff; cursor:pointer; font-size:11px; font-weight:900; }.upload-button:hover { background:#f0f8dc; }.upload-button input { display:none; }.image-size-fields { margin:0 0 9px; }.image-size-fields label { font-size:10px; }.image-card .field-help code { font-size:9px; }.editor-actions { display:grid; gap:8px; }.editor-actions .notice { margin:0!important; }.empty-list { padding:20px 8px; color:#718265; text-align:center; font-size:12px; }
@media (max-width:1020px) { .workspace { grid-template-columns:260px minmax(0,1fr); }.editor-layout { grid-template-columns:minmax(0,1fr); }.preview-column { grid-template-columns:repeat(2,minmax(0,1fr)); align-items:start; }.editor-actions { grid-column:1/-1; } }
@media (max-width:720px) { .workspace { grid-template-columns:1fr; }.catalog-panel { max-height:330px; }.editor-layout { grid-template-columns:1fr; }.editor-fields { order:2; }.preview-column { order:1; grid-template-columns:1fr; }.preview-stage { height:155px; }.studio-heading { align-items:flex-start; flex-direction:column; }.new-item { align-self:stretch; }.field-grid.three { grid-template-columns:repeat(2,minmax(0,1fr)); }.topbar { padding-inline:14px; } }

/* Match the furniture preview to the room renderer's cqw size and sprite ratio. */
.preview-stage { display:block; container-type:inline-size; }
.preview-title-row { display:flex; align-items:center; justify-content:space-between; gap:6px; }
.preview-scale { display:inline-flex; overflow:hidden; border:1px solid #b7d18c; border-radius:7px; background:#fffef4; }
.preview-scale button { min-width:31px; padding:3px 6px; border:0; color:#547343; background:transparent; font-size:9px; font-weight:900; cursor:pointer; }
.preview-scale button[aria-pressed="true"] { color:white; background:#398e37; }
.preview-floor { z-index:1; }
.preview-art { top:var(--preview-anchor,72%); bottom:auto; width:var(--preview-item-width,8cqw); height:auto; aspect-ratio:var(--sprite-ratio,1); transform:translate(-50%,var(--preview-anchor-y,-94%)); transform-origin:center bottom; filter:drop-shadow(0 3px 2px #382b1d55); }
.preview-duck { top:calc(var(--preview-anchor,72%) - var(--duck-seat-height,0cqw)); bottom:auto; width:14cqw; height:auto; aspect-ratio:auto; transform:translate(-50%,-92%); }
.preview-art { z-index:2; }
.preview-duck { position:absolute; z-index:3; bottom:auto; height:auto; aspect-ratio:362 / 402; transform:translate(-50%,calc(-100% + var(--seat-pose-y,0cqw))); filter:none; }
.preview-duck-sprite { display:block; width:100%; height:100%; background-repeat:no-repeat; background-position:100% 0; background-size:400% auto; filter:drop-shadow(0 4px 2px rgba(4,42,48,.18)); }
.preview-seat-front { position:absolute; z-index:4; width:var(--preview-item-width,8cqw); height:auto; aspect-ratio:var(--sprite-ratio,1); transform:translate(-50%,var(--preview-anchor-y,-94%)); transform-origin:center bottom; background-repeat:no-repeat; filter:none; pointer-events:none; }
.preview-seat-front[hidden] { display:none; }
.preview-duck[hidden] { display:none; }

.embedded-admin body { min-width:0; background:transparent; }
.embedded-admin .admin-shell { min-height:0; }
.embedded-admin .topbar { display:none; }
.embedded-admin .studio { max-width:none; margin:0; padding:6px 0 10px; }
.embedded-admin .admin-tabs { position:sticky; z-index:4; top:0; }

.admin-tabs { display:flex; gap:7px; margin:0 0 22px; padding:6px; border:1px solid #acd074; border-radius:15px; background:#eaf5cf; box-shadow:inset 0 1px 2px #54733218; }
.admin-tab { min-height:39px; padding:8px 17px; border:1px solid transparent; border-radius:10px; color:#426445; background:transparent; font-size:12px; font-weight:900; }
.admin-tab:hover { background:#f8fce9; }.admin-tab.is-active { border-color:#28772f; color:white; background:linear-gradient(#4eb341,#328936); box-shadow:0 2px 0 #236b2d; }
.admin-view[hidden] { display:none; }.admin-content-view { min-height:calc(100vh - 190px); }
.admin-workspace { display:grid; grid-template-columns:minmax(235px,.7fr) minmax(0,1.6fr); gap:15px; align-items:start; }
.admin-list-panel,.admin-form { min-width:0; padding:16px; border:2px solid #fff; border-radius:16px; outline:1px solid #9ac465; background:var(--cream); box-shadow:var(--shadow); }
.admin-list-panel { max-height:calc(100vh - 235px); overflow:auto; }.admin-list-panel h2,.admin-form h2 { margin:0 0 12px; font-size:16px; }
.admin-list-panel h2 { display:flex; align-items:baseline; justify-content:space-between; gap:8px; }.admin-list-panel h2 small { color:var(--muted); font-size:10px; font-weight:700; }
.badge-search { display:grid; gap:6px; margin:0 0 11px; color:var(--ink); font-size:11px; font-weight:800; }.badge-search input { width:100%; min-height:36px; padding:7px 9px; border:1px solid #adc97a; border-radius:9px; outline:none; color:#234833; background:#fff; font-size:12px; }.badge-search input:focus { border-color:#459b3e; box-shadow:0 0 0 3px #78be5532; }
.admin-list { display:grid; align-content:start; gap:7px; }.admin-list-row { display:grid; grid-template-columns:38px minmax(0,1fr); align-items:center; gap:9px; width:100%; min-height:56px; padding:6px; border:1px solid #cbdca4; border-radius:11px; color:var(--ink); background:#f8fbe9; text-align:left; }
.admin-list-row:hover,.admin-list-row[aria-current=true] { border-color:#55a747; background:#eef7d9; }.admin-list-row img { width:36px; height:36px; object-fit:contain; }.admin-list-row strong,.admin-list-row small { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }.admin-list-row strong { font-size:11px; }.admin-list-row small { margin-top:3px; color:var(--muted); font-size:9px; }
.empty-list { margin:8px 2px; }.admin-edit-column { display:grid; gap:14px; }.admin-field-grid { display:grid; align-content:start; gap:11px; }.admin-field-grid label,.admin-form>label,.award-fields label { display:grid; gap:6px; color:var(--ink); font-size:12px; font-weight:800; }.admin-field-grid label small { color:#78876b; font-size:10px; font-weight:600; }
.admin-form input:not([type=file]):not([type=checkbox]),.admin-form select,.admin-form textarea { width:100%; min-width:0; min-height:39px; padding:9px 10px; border:1px solid #adc97a; border-radius:9px; outline:none; color:#234833; background:#fff; font:inherit; font-size:12px; }.admin-form textarea { min-height:100px; resize:vertical; line-height:1.5; }.admin-form input:focus,.admin-form textarea:focus,.admin-form select:focus { border-color:#459b3e; box-shadow:0 0 0 3px #78be5532; }
.badge-editor-grid { display:grid; grid-template-columns:minmax(0,1fr) minmax(150px,.7fr); gap:18px; align-items:start; }.badge-preview-card { display:grid; justify-items:center; align-content:start; gap:9px; min-height:205px; padding:15px; border:1px solid #cfdfa9; border-radius:13px; background:#f6fae6; text-align:center; }.badge-preview-card img { width:100px; height:100px; object-fit:contain; }.badge-preview-card img:not([src]) { visibility:hidden; }.badge-preview-card strong { font-size:12px; }.badge-preview-card small { color:var(--muted); font-size:10px; }.upload-button { position:relative; overflow:hidden; }
.award-fields { display:grid; grid-template-columns:1fr 1fr .75fr auto; gap:9px; align-items:end; }.award-fields .secondary { min-height:39px; white-space:nowrap; }.award-form .notice { margin-top:10px!important; }
.news-workspace { grid-template-columns:minmax(235px,.65fr) minmax(0,1.7fr); }.news-form { display:grid; gap:13px; }.admin-form-heading { display:flex; align-items:center; justify-content:space-between; gap:12px; }.admin-form-heading h2 { margin:0; }.admin-form-heading span { color:#728265; font-size:10px; }.news-form>label { font-size:12px; }.news-form textarea { min-height:260px; }.news-image-row { display:flex; align-items:center; gap:10px; flex-wrap:wrap; }.news-image-row .upload-button { min-width:150px; margin:0; padding:8px; }.news-image-row>span { color:#728265; font-size:10px; }.news-image-preview { max-width:100%; padding:7px; border:1px solid #d1e0b0; border-radius:10px; background:#f8fbe9; }.news-image-preview img { display:block; max-width:100%; max-height:220px; object-fit:contain; }.news-actions { display:flex; gap:9px; }.news-actions .secondary { color:#8c4428; border-color:#dfab83; }.news-form .notice { margin:0!important; }
.maintenance-form { display:grid; gap:15px; max-width:760px; }.maintenance-form>label:not(.maintenance-switch) { display:grid; gap:6px; font-size:12px; font-weight:800; }.maintenance-form textarea { min-height:120px; }.maintenance-form .primary { justify-self:start; min-width:210px; }.maintenance-switch { display:flex; align-items:center; gap:10px; padding:12px; border:1px solid #d4e1b8; border-radius:11px; background:#f5f9e6; font-size:13px; font-weight:900; }.maintenance-switch input { width:18px; height:18px; accent-color:#308b37; }.maintenance-status { display:flex; align-items:center; gap:9px; padding:12px; border:1px solid #d2e1b4; border-radius:11px; background:#f8fbe9; }.maintenance-status strong { font-size:12px; }.maintenance-status .status-dot { width:10px; height:10px; border-radius:50%; background:#69a945; box-shadow:0 0 0 4px #69a94524; }.maintenance-status.is-active { border-color:#e2b548; background:#fff5cf; }.maintenance-status.is-active .status-dot { background:#e5a500; box-shadow:0 0 0 4px #e5a50024; }
@media (max-width:850px) { .admin-workspace,.news-workspace { grid-template-columns:1fr; }.admin-list-panel { max-height:280px; }.award-fields { grid-template-columns:1fr 1fr; }.badge-editor-grid { grid-template-columns:minmax(0,1fr) minmax(120px,.65fr); } }
@media (max-width:560px) { .admin-tabs { overflow:auto; }.admin-tab { flex:1 0 auto; padding-inline:12px; }.badge-editor-grid { grid-template-columns:1fr; }.badge-preview-card { grid-row:1; }.award-fields { grid-template-columns:1fr; }.admin-form,.admin-list-panel { padding:12px; }.news-form textarea { min-height:200px; }.admin-content-view .studio-heading { align-items:flex-start; } }
.voucher-workspace { grid-template-columns:minmax(270px,.9fr) minmax(0,1.3fr); }
.voucher-form { display:grid; gap:12px; }
.voucher-form .field-grid { margin:0; }
.voucher-form .field-grid label { display:grid; gap:6px; color:var(--ink); font-size:11px; font-weight:850; }
.voucher-form .field-grid label small { color:#748469; font-size:9px; font-weight:600; }
.voucher-form .field-grid label[hidden] { display:none; }
.voucher-form .field-help { margin:0; }
.voucher-form > .primary { justify-self:start; min-width:170px; }
.voucher-form .notice { min-height:16px; margin:0!important; }
.voucher-admin-row { display:flex; align-items:center; justify-content:space-between; gap:9px; padding:9px; border:1px solid #cbdca4; border-radius:11px; background:#f8fbe9; }
.voucher-admin-copy { display:grid; gap:3px; min-width:0; }
.voucher-admin-copy strong { overflow-wrap:anywhere; color:#254b32; font-size:12px; letter-spacing:.04em; }
.voucher-admin-copy span { color:#3f7c38; font-size:10px; font-weight:850; }
.voucher-admin-copy small { color:#718066; font-size:9px; line-height:1.35; }
.voucher-toggle { flex:0 0 auto; padding:6px 8px; font-size:9px; }
.voucher-toggle.is-disabled { border-color:#c98b66; color:#8b472b; background:#fff3e8; }
@media (max-width:850px) { .voucher-workspace { grid-template-columns:1fr; } }