@charset "UTF-8";
:root{--ink:#2d312b;--paper:#f6f2ea;--green:#334438;--gold:#b69367;--muted:#838378}
*{box-sizing:border-box}html,body{margin:0;height:100%;overflow:hidden}body{font:15px/1.5 "Segoe UI",Arial,system-ui,sans-serif;color:var(--ink);background:#e4dfd5;-webkit-font-smoothing:antialiased}button,input,textarea{font:inherit}button{cursor:pointer}a{color:inherit;text-decoration:none}[hidden]{display:none!important}button:focus-visible,a:focus-visible,textarea:focus-visible{outline:2px solid #c18c58;outline-offset:4px}.experience{position:relative;height:100vh;height:100dvh;width:100%;overflow:hidden;background:radial-gradient(circle at 35% 18%,#f4f0e9,#bcb6a8)}#room-canvas{position:absolute;inset:0;display:block;width:100%;height:100%;touch-action:pan-y}.grain-layer{position:absolute;inset:0;pointer-events:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 128 128'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.6' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='128' height='128' filter='url(%23n)' opacity='.2'/%3E%3C/svg%3E");opacity:.115;mix-blend-mode:multiply;z-index:2}.topbar{position:absolute;z-index:6;top:0;left:0;right:0;padding:clamp(20px,4vw,48px) clamp(23px,5.2vw,80px);display:flex;align-items:flex-start;justify-content:space-between;pointer-events:none}.topbar>*{pointer-events:auto}.identity{display:flex;gap:14px;align-items:center}.identity-mark{font:italic 47px/1 Georgia,serif;letter-spacing:-.12em}.identity-name{font-weight:800;font-size:14px;line-height:1.2;letter-spacing:.25em}.identity-name small{display:block;color:#6b7069;font-weight:600;letter-spacing:.15em;font-size:8px;margin-top:6px}.info-button{width:35px;height:35px;border-radius:100%;background:#f1eee9b5;border:1px solid #aaa99a80;color:#343c34;font:italic 19px Georgia,serif;backdrop-filter:blur(8px)}.info-button:hover{background:#fff}.intro{position:absolute;z-index:4;left:clamp(23px,5.2vw,80px);top:clamp(125px,20vh,220px);pointer-events:none;max-width:450px;text-shadow:0 1px 22px #f4f0e9b8;transition:opacity .6s,transform .6s}.micro{display:block;letter-spacing:.22em;font-weight:750;font-size:10px;color:#9e7e56;text-transform:uppercase}.intro h1{font:400 clamp(39px,4.1vw,67px)/1.07 Georgia,"Times New Roman",serif;letter-spacing:-.055em;margin:25px 0 21px}.intro h1 i{font-weight:400;color:#987356}.intro p{font-size:14px;color:#646960;line-height:1.75;margin:0}.intro.hidden-state{opacity:0;transform:translateY(-15px)}.brush-anchor{position:absolute;z-index:5;left:52%;top:45%;width:135px;height:230px;transform:translate(-50%,-50%);display:flex;align-items:center;justify-content:center;pointer-events:none;transition:opacity .35s}.brush-anchor.is-hidden{opacity:0;pointer-events:none}.brush-button{pointer-events:auto;width:100%;height:100%;border:0;background:transparent;border-radius:50%;position:relative;cursor:pointer}.brush-ring{position:absolute;top:14%;left:9%;right:9%;bottom:12%;border-radius:50%;border:1px solid rgba(255,255,255,.22);box-shadow:0 0 30px #f5ddba36,inset 0 0 32px #fff3;transform:rotate(-14deg);transition:box-shadow .25s,border-color .25s}.brush-button:hover .brush-ring,.brush-button:focus-visible .brush-ring{border-color:#faf0d1a3;box-shadow:0 0 36px #fff8c7a3,inset 0 0 22px #ffffff3c}.brush-caption{position:absolute;top:84%;left:72%;white-space:nowrap;display:flex;align-items:center;gap:12px;color:#4d574a;font-size:10px;font-weight:700;letter-spacing:.14em;text-shadow:0 1px 7px #fff}.caption-line{width:31px;height:1px;background:#687063}.room-bottom{position:absolute;z-index:4;bottom:clamp(22px,4vw,48px);left:clamp(23px,5.2vw,80px);right:clamp(23px,5.2vw,80px);display:flex;justify-content:space-between;align-items:center;gap:15px;pointer-events:none;color:#515a51;font-size:10px;letter-spacing:.11em;text-transform:uppercase}.room-place{display:flex;gap:11px;align-items:center}.pin{display:block;width:6px;height:6px;border-radius:50%;background:#b28a55;box-shadow:0 0 0 5px #b28a5530}.room-hint{color:#89897e}.modal-backdrop{position:absolute;inset:0;z-index:12;background:rgba(24,29,23,.28);display:flex;align-items:center;justify-content:center;padding:18px;backdrop-filter:blur(13px);-webkit-backdrop-filter:blur(13px);overflow-y:auto}.create-panel,.info-panel{position:relative;width:min(510px,100%);max-height:min(90dvh,820px);overflow-y:auto;background:rgba(251,248,241,.97);box-shadow:0 35px 100px #18201646;padding:clamp(28px,4vw,54px);border:1px solid #e2dbcc}.panel-close{position:absolute;top:16px;right:20px;width:35px;height:35px;background:transparent;border:0;font:32px Georgia,serif;color:#636d60;line-height:1}.panel-close:hover{color:#a56c46}.panel-header h2,.info-panel h2{font:400 clamp(34px,4vw,47px)/1.09 Georgia,serif;letter-spacing:-.045em;margin:18px 0 15px}.panel-header h2 em,.info-panel h2 em{font-weight:400;color:#a57c55}.panel-header p,.info-panel p{margin:0 0 25px;color:#73796e;font-size:13px;line-height:1.7}.panel-stage{margin-top:30px}.upload-tile{min-height:160px;border:1px dashed #b4ad9d;display:flex;flex-direction:column;align-items:center;justify-content:center;background:#f3efe6;gap:6px;transition:background .2s,border-color .2s;cursor:pointer}.upload-tile:hover{background:#eae4d8;border-color:#a87b52}.upload-icon{font:41px Georgia,serif;color:#a4845b;line-height:1}.upload-tile strong,.camera-tile strong{font-size:13px;font-weight:700;display:block}.upload-tile small,.camera-tile small{color:#818478;font-size:11px}.camera-tile{width:100%;border:1px solid #dfd8c9;background:#fbf8f1;padding:17px 19px;display:flex;gap:18px;align-items:center;text-align:left;margin-top:11px;transition:background .2s}.camera-tile:hover{background:#f0ebe1}.camera-illustration{font:31px Georgia,serif;color:#b68b5f}.camera-tile .arrow{margin-left:auto;color:#a08158;font-size:20px}.privacy-note,.engine-note{font-size:11px;color:#828479;line-height:1.65;margin:15px 0 0}.chosen-file{display:flex;gap:14px;align-items:center;background:#ede9de;padding:12px;margin-bottom:27px}.chosen-file img{width:66px;height:74px;object-fit:cover}.chosen-file .micro{font-size:9px}.chosen-file p{margin:6px 0 0;font-size:12px;line-height:1.5;color:#777c70}.chosen-file button{margin-left:auto;border:0;background:none;font-size:25px;color:#899081}.field-label{font-weight:700;font-size:12px;display:block;margin-bottom:9px}.panel-stage textarea{display:block;resize:vertical;width:100%;min-height:132px;max-height:270px;padding:15px;background:#fffcf7;border:1px solid #cdc8bc;color:var(--ink);font-size:13px;line-height:1.6}.panel-stage textarea::placeholder{color:#98978c}.rules-small{font-size:10px;line-height:1.65;color:#888579;padding:11px 0 16px}.panel-actions{display:flex;flex-direction:column;gap:9px}.primary-action,.secondary-action,.control-dark,.control-light{display:flex;align-items:center;justify-content:space-between;gap:22px;width:100%;min-height:52px;padding:12px 18px;border:1px solid #304136;background:#304136;color:#fff;font-size:12px;font-weight:700;transition:background .2s,transform .2s}.primary-action span,.control-dark span{font-size:17px;font-weight:400}.primary-action:hover,.control-dark:hover{background:#526b55;transform:translateY(-1px)}.primary-action:disabled{opacity:.53;cursor:not-allowed}.secondary-action,.control-light{background:transparent;border-color:#bdb9ab;color:var(--ink)}.secondary-action:hover,.control-light:hover{background:#ede8de}.engine-note{min-height:20px}.progress-stage{text-align:center;padding:40px 10px 35px}.progress-stage h3{font:400 33px Georgia,serif;margin:20px 0 14px}.progress-stage p{font-size:13px;color:#777}.progress-orb{width:70px;height:70px;display:block;margin:auto;border-radius:50%;background:linear-gradient(125deg,#987b54,#e0cfaa,#627f69);animation:turn 2s linear infinite;box-shadow:0 0 25px #bcb19e}.info-panel{width:min(480px,100%)}.info-panel h2{margin-top:20px}.info-panel p{font-size:14px}.info-panel .tiny{font-size:11px;color:#8a887c}.result-controls{position:absolute;z-index:7;left:clamp(24px,5.2vw,80px);bottom:clamp(22px,5vw,75px);right:clamp(24px,5.2vw,80px);display:flex;justify-content:space-between;align-items:end;gap:25px}.result-meta{display:flex;flex-direction:column;gap:6px;text-shadow:0 0 10px #fff}.result-meta span{font-size:10px;letter-spacing:.19em;color:#a27353;font-weight:750}.result-meta strong{font:400 clamp(23px,3vw,37px) Georgia,serif}.result-buttons{display:flex;gap:10px;flex-wrap:wrap;justify-content:flex-end}.result-buttons button{width:auto;min-height:46px;padding:12px 18px}.toast{position:absolute;z-index:18;bottom:35px;left:50%;transform:translate(-50%,120px);padding:15px 22px;background:#2c4337;color:#fff;max-width:min(440px,calc(100vw - 32px));font-size:12px;line-height:1.55;text-align:center;box-shadow:0 15px 38px #15251b49;opacity:0;transition:transform .25s,opacity .25s;pointer-events:none}.toast.show{opacity:1;transform:translate(-50%,0)}.loading{position:absolute;z-index:21;inset:0;background:#eee9df;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:18px;color:#72776d;letter-spacing:.24em;font-size:10px;font-weight:700;transition:opacity .8s,visibility .8s}.loading.is-done{opacity:0;visibility:hidden}.loading-bar{width:140px;height:2px;background:#d7d0c2;overflow:hidden}.loading-bar span{display:block;width:46%;height:100%;background:#a88863;animation:load 1.35s infinite ease-in-out}.no-webgl{position:absolute;z-index:10;inset:0;display:flex;justify-content:center;align-items:center;flex-direction:column;background:#e8e1d3;padding:30px;text-align:center}.no-webgl .primary-action{max-width:275px}@keyframes load{0%{transform:translateX(-120%)}100%{transform:translateX(340%)}}@keyframes turn{to{transform:rotate(360deg)}}
@media(max-width:850px){.intro{top:120px;max-width:320px}.intro h1{font-size:45px}.intro p{font-size:12px}.brush-caption{font-size:9px;top:86%;left:35%;}.room-hint{display:none}.result-controls{align-items:start;flex-direction:column;gap:14px}.result-buttons{justify-content:flex-start}.topbar{padding-top:22px}.identity-mark{font-size:40px}}@media(max-width:600px){.intro{top:82px;max-width:240px;left:23px}.intro h1{font-size:33px;margin:13px 0 9px}.intro p{font-size:11px}.micro{font-size:9px}.identity-name{font-size:11px}.identity-name small{font-size:7px}.identity-mark{font-size:36px}.brush-anchor{height:175px;width:100px}.brush-caption{top:93%;left:5%;font-size:8px;gap:6px}.caption-line{width:18px}.room-bottom{font-size:9px;bottom:20px}.modal-backdrop{align-items:center;padding:12px}.create-panel,.info-panel{max-height:94dvh;padding:27px 23px}.panel-header h2{font-size:34px}.panel-stage{margin-top:22px}.upload-tile{min-height:130px}.result-controls{bottom:24px}.result-meta strong{font-size:23px}.result-buttons button{min-height:43px;font-size:11px;padding:8px 12px}.room-place{max-width:230px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

/* Compact editorial form: the primary actions remain visible on ordinary laptops. */
.create-panel{padding:31px 36px;max-height:94dvh}
.panel-header h2{font-size:38px;margin:12px 0 9px}
.panel-header p{margin:0 0 8px}
.create-panel .panel-stage{margin-top:17px}
.chosen-file{margin-bottom:17px;padding:9px}
.chosen-file img{width:57px;height:64px}
.panel-stage textarea{min-height:105px}
.rules-small{padding:8px 0 10px;line-height:1.55}
.panel-actions{gap:7px}
.panel-actions .primary-action,.panel-actions .secondary-action{min-height:47px}
.engine-note{margin-top:9px;min-height:16px}
.result-controls{left:50%;right:auto;bottom:27px;width:min(980px,calc(100% - 46px));transform:translateX(-50%);padding:13px 17px;align-items:center;background:rgba(247,244,237,.91);border:1px solid rgba(227,219,206,.9);border-radius:10px;backdrop-filter:blur(14px);box-shadow:0 12px 50px rgba(26,30,26,.14)}
.result-meta{min-width:185px;flex:1}
.result-meta strong{font-size:22px;line-height:1.1}
.result-buttons{flex-shrink:0}
.result-buttons button{min-height:43px;padding:10px 13px;font-size:11px}
@media(max-width:850px){.result-controls{bottom:19px;align-items:stretch}.result-buttons{justify-content:flex-start}.result-meta strong{font-size:20px}}
@media(max-width:600px){.create-panel{padding:22px 20px}.panel-header h2{font-size:32px}.result-controls{width:calc(100% - 24px);bottom:12px;padding:12px;gap:10px}.result-meta strong{font-size:20px}.result-buttons{gap:6px}.result-buttons button{padding:8px 10px;min-height:39px;font-size:10px}}

/* Standard painting formats — calm, deliberate form design. */
.canvas-size-select { width:100%;min-height:44px;appearance:auto;padding:10px 13px;color:#303c32;
  background:#fffcf7;border:1px solid #cdc8bc;border-radius:0;font-size:13px; }
.canvas-size-select:focus-visible {outline:2px solid #c18c58;outline-offset:2px}
.canvas-size-note {font-size:11px;line-height:1.55;color:#777c70;margin:8px 0 18px}


/* Two-room experience · small game controls, designed to stay behind the artwork UI. */
#room-canvas{touch-action:none}
.brush-anchor.out-of-view{opacity:0;pointer-events:none}
.walk-hud{position:absolute;z-index:5;inset:0;pointer-events:none}
.walk-tools{position:absolute;right:clamp(22px,5.2vw,80px);top:112px;display:flex;align-items:flex-end;flex-direction:column;gap:9px;pointer-events:none}
.walk-location{font-size:10px;font-weight:800;letter-spacing:.17em;color:#455248;text-shadow:0 1px 12px #fff}
.walk-start,.door-action{font-size:11px;font-weight:750;background:rgba(246,243,234,.86);border:1px solid #bdb5a4;padding:11px 16px;min-height:40px;pointer-events:auto;color:#334539;box-shadow:0 6px 24px #0000000c;backdrop-filter:blur(13px)}
.walk-start span{font-size:17px;margin-left:8px;vertical-align:middle}
.walk-start:hover,.door-action:hover{background:#fff}
.door-action{background:#334438;color:#fff;border-color:#334438}
.door-action:hover{background:#4f6554}
.gallery-status{position:absolute;right:clamp(23px,5.2vw,80px);bottom:clamp(24px,4vw,51px);display:none;flex-direction:column;align-items:flex-end;gap:4px;text-shadow:0 1px 9px white}
.gallery-status span{color:#857d6e;letter-spacing:.18em;font-weight:800;font-size:9px}
.gallery-status strong{color:#39443b;font:400 16px Georgia,serif}
.walk-hud.inside-gallery .gallery-status{display:flex}
.walk-crosshair{position:absolute;left:50%;top:50%;width:5px;height:5px;margin:-3px;opacity:.5;border:1px solid #fff;box-shadow:0 0 1px 1px #343f36;border-radius:50%}
.mobile-pad,.touch-look{display:none}
.flat-viewer{position:absolute;z-index:16;inset:0;display:flex;align-items:center;justify-content:center;background:rgba(18,22,19,.96);padding:70px 24px 40px}
.flat-close{position:absolute;right:clamp(22px,5vw,72px);top:25px;color:#f6efe5;border:1px solid #86827a;background:transparent;padding:10px 16px;font-size:12px}
.flat-work{max-width:100%;max-height:100%;display:flex;flex-direction:column;gap:12px;align-items:center}
.flat-work img{max-height:calc(100dvh - 150px);max-width:min(94vw,1200px);object-fit:contain;box-shadow:0 20px 80px #0009}
.flat-work span{color:#c5c0b6;font-size:11px;letter-spacing:.11em;text-align:center}
@media(max-width:850px){
  .walk-tools{top:82px;right:23px;gap:5px}
  .walk-start,.door-action{min-height:35px;padding:8px 11px;font-size:10px}
  .walk-location{font-size:8px}
  .walk-crosshair{opacity:.33}
  .gallery-status{right:22px;bottom:21px}
}
@media(pointer:coarse){
  .mobile-pad{display:flex;position:absolute;left:22px;bottom:90px;width:118px;height:118px;border-radius:100%;border:1px solid rgba(255,255,255,.74);background:rgba(248,247,240,.25);box-shadow:inset 0 0 0 14px rgba(255,255,255,.09);justify-content:center;align-items:center;pointer-events:auto;touch-action:none}
  .mobile-knob{width:52px;height:52px;border-radius:50%;background:rgba(247,242,231,.70);border:1px solid #9f9587;box-shadow:0 4px 20px #0002}
  .touch-look{display:block;position:absolute;bottom:26px;right:20px;font-size:9px;color:#39433a;background:rgba(255,255,255,.46);padding:5px 9px;max-width:145px;text-align:right}
  .room-bottom{display:none}
}
@media(max-width:600px){
  .walk-tools{top:78px;right:15px}
  .walk-location{max-width:170px;text-align:right;font-size:7px}
  .walk-start{max-width:180px}
  .gallery-status{bottom:12px}
  .walk-hud.inside-gallery .gallery-status{left:150px;right:12px}
  .walk-hud .walk-start{background:#fff9}
  .flat-work img{max-height:calc(100dvh - 125px)}
  .result-controls{max-height:34dvh;overflow-y:auto}
  .result-buttons{width:100%}
}

/* Precise stable brush target that does not cover the painting. */
.brush-anchor{width:104px;height:157px}
@media(max-width:600px){.brush-anchor{width:84px;height:128px}}

/* Individual RGB controls, neutral and unobtrusive against the 3D apartment. */
.lighting-backdrop{position:absolute;inset:0;z-index:19;display:flex;align-items:center;justify-content:center;padding:16px;background:rgba(25,29,26,.49);backdrop-filter:blur(9px)}
.lighting-card{width:min(440px,100%);max-height:92dvh;overflow-y:auto;background:#f6f3ed;border:1px solid #d5cdc0;box-shadow:0 28px 85px rgba(21,25,21,.36);padding:26px 28px 22px;color:#344036}
.lighting-head{display:flex;justify-content:space-between;align-items:flex-start;gap:18px}
.lighting-head h2{font:400 clamp(23px,3vw,31px)/1.12 Georgia,serif;margin:8px 0 0}
.lighting-head button{border:0;background:transparent;font:32px/1 Georgia,serif;color:#536151}
.lighting-description{font-size:12px;line-height:1.6;color:#787b71;margin:16px 0 20px}
.lighting-columns{display:flex;align-items:start;gap:20px;margin-bottom:19px}
.lighting-color-choice{display:flex;flex-direction:column;gap:8px;font-size:12px;font-weight:700;min-width:105px}
.lighting-color-choice input{appearance:none;border:1px solid #b5ac9c;background:#fff;width:82px;height:47px;padding:3px;cursor:pointer}
.lighting-range{flex:1;display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px;font-size:12px;font-weight:700}
.lighting-range span{color:#9d805e;font-size:12px}
.lighting-range input{width:100%;accent-color:#9b7b56;cursor:pointer}
.lighting-mode-field{display:block;font-weight:700;font-size:12px;margin-bottom:8px}
#lighting-mode{width:100%;min-height:44px;border:1px solid #c9c1b4;color:#36443b;background:#fffefa;padding:10px 12px;font-size:13px}
.lighting-audio{margin-top:16px;display:flex;gap:9px;flex-wrap:wrap;align-items:center}
.lighting-audio label{cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:13px;font-weight:650;font-size:12px;padding:10px 12px;border:1px solid #c9c1b4;flex:1}
.lighting-audio label span{color:#9b7b56;white-space:nowrap}
.lighting-audio button,.lighting-secondary{background:#f0ebe2;border:1px solid #c6bbaa;color:#344036;padding:10px 12px;font-size:12px;cursor:pointer}
.lighting-audio small{width:100%;color:#81857d;font-size:10px;line-height:1.5}
.lighting-footnote{font-size:10px;color:#8d8c7e;line-height:1.55;margin:15px 0 0}
.lighting-secondary{margin-top:16px;width:100%}
@media(max-width:600px){.lighting-card{padding:22px 19px}.lighting-columns{gap:10px}.lighting-color-choice{min-width:95px}}