/* 잊지않을게 — 별빛 추모관 (3D) */
.hall-body{margin:0;height:100vh;height:100dvh;overflow:hidden;background:#141C25;overscroll-behavior:none;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent}
#scene{position:fixed;inset:0;width:100%;height:100%;display:block;touch-action:none;outline:none}

.hall-top{position:fixed;z-index:10;top:0;left:0;right:0;display:flex;align-items:center;gap:10px;padding:max(10px,env(safe-area-inset-top)) max(14px,env(safe-area-inset-right)) 10px max(14px,env(safe-area-inset-left));background:linear-gradient(rgba(20,28,37,.85),rgba(20,28,37,0))}
.hall-top .brand{color:#FFFDF8}
.hall-title{flex:1;min-width:0;text-align:center;color:#E9C98B;font-size:14px;font-weight:600;white-space:nowrap}
.hall-btn{flex:none;white-space:nowrap;display:inline-flex;align-items:center;height:36px;padding:0 14px;border-radius:999px;border:1px solid rgba(255,253,248,.3);color:#FFFDF8;text-decoration:none;font-size:14px;font-weight:600}

.hall-hint{position:fixed;z-index:5;left:50%;top:calc(max(10px,env(safe-area-inset-top)) + 52px);transform:translateX(-50%);margin:0;padding:6px 14px;border-radius:999px;background:rgba(20,28,37,.6);color:#E6E1D6;font-size:13px;white-space:nowrap;pointer-events:none;transition:opacity .6s}
.hall-hint.gone{opacity:0}

.hall-look{position:fixed;z-index:10;left:50%;bottom:calc(36px + env(safe-area-inset-bottom));transform:translateX(-50%);height:52px;padding:0 26px;border-radius:999px;border:0;background:#E9C98B;color:#1B2530;font:inherit;font-size:16px;font-weight:700;white-space:nowrap;box-shadow:0 6px 24px rgba(0,0,0,.35);cursor:pointer}

.joy{position:fixed;z-index:10;left:calc(22px + env(safe-area-inset-left));bottom:calc(26px + env(safe-area-inset-bottom));width:120px;height:120px;border-radius:50%;background:rgba(255,253,248,.12);border:1px solid rgba(255,253,248,.25);touch-action:none}
.joy-knob{position:absolute;left:50%;top:50%;width:52px;height:52px;margin:-26px 0 0 -26px;border-radius:50%;background:rgba(255,253,248,.75);box-shadow:0 2px 10px rgba(0,0,0,.3)}
@media (hover:hover) and (pointer:fine){.joy{opacity:.7}}

.hall-loading{position:fixed;inset:0;z-index:20;display:flex;align-items:center;justify-content:center;background:#141C25;color:#E9C98B;font-size:18px;letter-spacing:.1em;transition:opacity .8s}
.hall-loading.done{opacity:0;pointer-events:none}

/* 안치단 시트 */
.niche-card{display:flex;gap:14px;align-items:center;margin-bottom:14px}
.niche-card img{width:88px;height:110px;object-fit:cover;border-radius:10px;background:#EDE8DC;flex:none}
.niche-card b{display:block;font-size:20px}
.niche-card small{display:block;color:var(--muted);font-size:13px}
.niche-code{display:inline-block;font-size:12px;font-weight:700;color:var(--primary);background:var(--soft);border-radius:999px;padding:1px 9px;margin-bottom:4px}
.niche-actions{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin:12px 0}
.niche-actions button{display:flex;flex-direction:column;align-items:center;gap:2px;padding:10px 2px;border-radius:14px;border:1px solid var(--line);background:var(--surface);font:inherit;font-size:13px;font-weight:600;cursor:pointer;white-space:nowrap}
.niche-actions button span{font-size:24px;line-height:1.1}
.niche-actions button:disabled{opacity:.45;cursor:default}
.niche-empty{text-align:center;padding:6px 0 10px}
.niche-empty b{display:block;font-size:22px}
.niche-empty small{color:var(--muted)}
.field select{width:100%;padding:12px 14px;border-radius:12px;border:1px solid var(--line);background:var(--surface)}

/* ---------- 자리 안 · 아이 보기 ---------- */
.is-inside .joy,.is-inside .hall-look,.is-inside .hall-hint,.is-inside .hall-top{opacity:0;pointer-events:none}
.joy,.hall-look,.hall-top{transition:opacity .35s}
.niche-ui{position:fixed;inset:0;z-index:12;pointer-events:none;display:flex;flex-direction:column;justify-content:space-between}
.niche-ui[hidden]{display:none}
.niche-ui-top{pointer-events:auto;display:flex;align-items:center;gap:10px;padding:max(12px,env(safe-area-inset-top)) 14px 12px;background:linear-gradient(rgba(20,28,37,.78),rgba(20,28,37,0))}
.niche-ui-title{flex:1;min-width:0;display:flex;align-items:baseline;justify-content:center;gap:8px;color:#FFFDF8;white-space:nowrap}
.niche-ui-title span{font-size:13px;font-weight:700;color:#E9C98B}
.niche-ui-title b{font-size:18px}
.round-btn{flex:none;width:44px;height:44px;border-radius:50%;border:0;background:rgba(255,253,248,.92);color:#2A3530;display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 4px 0 rgba(0,0,0,.18),0 8px 18px rgba(0,0,0,.25)}
.round-btn:active{transform:translateY(2px);box-shadow:0 2px 0 rgba(0,0,0,.18)}
.round-spacer{width:44px;flex:none}
.niche-ui-actions{pointer-events:auto;display:flex;justify-content:center;gap:8px;flex-wrap:wrap;padding:14px 12px calc(20px + env(safe-area-inset-bottom));background:linear-gradient(rgba(20,28,37,0),rgba(20,28,37,.8))}
.niche-ui-actions button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;min-width:62px;height:70px;padding:0 8px;border-radius:20px;border:0;background:#FFFDF8;color:#2A3530;font:inherit;font-size:12px;font-weight:700;white-space:nowrap;cursor:pointer;box-shadow:0 5px 0 #CFC5B3,0 10px 22px rgba(0,0,0,.3);transition:transform .1s,box-shadow .1s}
.niche-ui-actions button span{font-size:24px;line-height:1.1}
.niche-ui-actions button:active{transform:translateY(4px);box-shadow:0 1px 0 #CFC5B3,0 4px 10px rgba(0,0,0,.25)}
.niche-ui-actions button:disabled{opacity:.5}
.niche-ui-actions .niche-ui-main{flex-direction:row;height:54px;padding:0 34px;font-size:17px;background:#E9C98B;color:#1B2530;box-shadow:0 5px 0 #B9975B,0 10px 22px rgba(0,0,0,.3)}
.pet-say{align-self:center;margin:0 0 calc(40px + env(safe-area-inset-bottom));padding:10px 20px;border-radius:999px;background:rgba(255,253,248,.92);color:#2A3530;font-weight:700;white-space:nowrap;box-shadow:0 6px 18px rgba(0,0,0,.25)}

/* ---------- 밝은 추모관 테마 ---------- */
.hall-body{background:#F4EFE6}
.hall-top{background:linear-gradient(rgba(255,253,248,.92),rgba(255,253,248,0))}
.hall-top .brand{color:#2A3530}
.hall-title{color:#9A7A3E}
.hall-btn{color:#2A3530;border-color:rgba(42,53,48,.25);background:rgba(255,253,248,.7)}
.hall-hint{background:rgba(255,253,248,.85);color:#5F665F;box-shadow:0 4px 14px rgba(60,50,30,.12)}
.hall-loading{background:#F4EFE6;color:#9A7A3E}
.joy{background:rgba(255,253,248,.55);border-color:rgba(154,122,62,.35);box-shadow:0 8px 20px rgba(60,50,30,.15)}
.joy-knob{background:#FFFDF8;box-shadow:0 3px 0 #DCCFB8,0 6px 14px rgba(60,50,30,.25)}
.hall-look{background:#FFFDF8;color:#2A3530;box-shadow:0 5px 0 #DCCFB8,0 10px 24px rgba(60,50,30,.25)}
.niche-ui-top{background:linear-gradient(rgba(255,253,248,.9),rgba(255,253,248,0))}
.niche-ui-title{color:#2A3530}
.niche-ui-title span{color:#A88445}
.niche-ui-actions{background:linear-gradient(rgba(255,253,248,0),rgba(255,253,248,.85))}
.niche-ui-actions .niche-ui-main{background:#3E6050;color:#FFFDF8;box-shadow:0 5px 0 #2C4639,0 10px 22px rgba(0,0,0,.2)}

/* ---------- 하단 탭과 함께 ---------- */
.hall-body{padding-bottom:0}
.joy{bottom:calc(96px + env(safe-area-inset-bottom))}
.hall-look{bottom:calc(104px + env(safe-area-inset-bottom))}
.is-inside .tabbar{transform:translateY(110%);transition:transform .3s}
.tabbar{transition:transform .3s}
.hall-btn.icon{width:40px;padding:0;justify-content:center;font-size:18px}
@media (max-width:420px){.hall-top .brand span{display:none}}
.theme-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.theme-card{display:grid;gap:8px;padding:12px;border-radius:18px;border:2px solid transparent;background:var(--surface);box-shadow:var(--shadow-soft);font:inherit;cursor:pointer;text-align:left}
.theme-card.on{border-color:var(--primary)}
.theme-card .sw{display:grid;grid-template-columns:repeat(4,1fr);height:44px;border-radius:10px;overflow:hidden}
.theme-card .sw i{display:block}
.theme-card b{font-size:15px;white-space:nowrap}
.niche-ui-actions{gap:6px;flex-wrap:nowrap}
.niche-ui-actions button{min-width:0;flex:1 1 0;max-width:72px;height:66px;padding:0 2px;font-size:11px}
.niche-ui-actions button span{font-size:22px}

/* ---------- 쉼터 · 네컷 ---------- */
.niche-ui-actions button[data-sit]{max-width:88px}
.booth-count{position:fixed;left:50%;top:42%;transform:translate(-50%,-50%);margin:0;font-size:96px;font-weight:800;color:#FFFDF8;text-shadow:0 4px 24px rgba(0,0,0,.45);pointer-events:none}
.booth-count[hidden]{display:none}
.flash{position:fixed;inset:0;z-index:40;background:#FFFFFF;opacity:0;pointer-events:none}
.flash.go{animation:flash .5s ease-out}
@keyframes flash{0%{opacity:.95}100%{opacity:0}}
#booth-ui .niche-ui-actions .niche-ui-main{max-width:none;flex:none;padding:0 40px;font-size:17px;height:56px;gap:6px}
#booth-ui .niche-ui-main span{font-size:22px}
.strip-preview{display:flex;justify-content:center;margin-bottom:12px}
.strip-preview img{max-height:52vh;width:auto;max-width:100%;border-radius:8px;box-shadow:0 12px 30px -10px rgba(0,0,0,.4)}
.gal-view{display:flex;justify-content:center;margin-bottom:12px}
.gal-view img{width:100%;max-width:300px;aspect-ratio:4/5;object-fit:cover;border-radius:16px;box-shadow:0 12px 30px -10px rgba(0,0,0,.35)}
.gal-name{text-align:center;margin:0}
.gal-meta{text-align:center;color:var(--muted);margin:4px 0 14px;font-size:14px}
.hang-pick{margin:0 0 12px}
.hang-pick button{border:0;font:inherit;cursor:pointer}
.hang-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-bottom:8px}
.hang-slot{margin:0;display:flex;flex-direction:column;align-items:center;gap:4px}
.hang-slot img{width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:12px;border:3px solid #D9B979}
.hang-slot.empty{aspect-ratio:4/5;justify-content:center;border-radius:12px;border:2px dashed #D9C9A8;background:#F6F0E4;color:#B9975B;font-size:30px;font-weight:700}
.hang-count{text-align:center;color:var(--muted);font-size:14px;margin:4px 0 12px}
label.btn.disabled{opacity:.5;pointer-events:none}
label.btn{cursor:pointer}
.hang-pick button{flex:none;white-space:nowrap;padding:9px 16px;border-radius:999px;background:var(--surface);color:var(--muted);font-weight:700;font-size:14px;box-shadow:0 3px 0 #DDD4C3}
.hang-pick button.on{background:var(--primary);color:#fff;box-shadow:0 3px 0 var(--depth)}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.note-colors{display:flex;gap:10px;margin:4px 0 12px}
.note-colors button{width:36px;height:36px;border-radius:10px;border:2px solid transparent;cursor:pointer;box-shadow:0 2px 6px rgba(0,0,0,.12)}
.note-colors button[aria-checked="true"]{border-color:#8A6A2E}
.note-input{width:100%;box-sizing:border-box;padding:14px;border:0;border-radius:6px;font:inherit;font-size:16px;line-height:1.6;resize:none;box-shadow:0 6px 16px rgba(0,0,0,.12)}
.note-card{margin:4px auto 16px;max-width:300px;min-height:180px;padding:22px 20px 16px;border-radius:6px;box-shadow:0 10px 26px rgba(0,0,0,.16);transform:rotate(-1.5deg);display:flex;flex-direction:column;justify-content:space-between}
.note-card p{margin:0;font-size:17px;line-height:1.65;white-space:pre-wrap;word-break:keep-all;color:#4A3A2A}
.note-card small{margin-top:12px;color:#8A7A60;font-size:13px}
.pet-bottom{display:flex;flex-direction:column;align-items:center}
.pet-bottom .pet-say{margin:0 0 4px}
#pet-actions{align-self:stretch}
#pet-actions button{max-width:96px}
.buddy-chip{position:fixed;z-index:11;left:50%;top:calc(max(10px,env(safe-area-inset-top)) + 96px);transform:translateX(-50%);display:flex;align-items:center;gap:10px;padding:6px 6px 6px 14px;border-radius:999px;background:rgba(255,253,248,.95);box-shadow:0 6px 18px rgba(60,50,30,.18);font-size:14px;font-weight:700;color:#2A3530;white-space:nowrap}
.buddy-chip[hidden]{display:none}
.buddy-chip button{border:0;border-radius:999px;background:#3E6050;color:#FFFDF8;font:inherit;font-size:13px;padding:6px 12px;cursor:pointer}
.is-inside .buddy-chip{display:none}
.mem-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;max-height:46vh;overflow:auto;margin-bottom:8px}
.mem-cell{position:relative;margin:0;aspect-ratio:4/5;border-radius:10px;overflow:hidden;background:#F6F0E4}
.mem-cell img{width:100%;height:100%;object-fit:cover;display:block}
.mem-del{position:absolute;top:4px;right:4px;width:26px;height:26px;border:0;border-radius:50%;background:rgba(30,30,30,.6);color:#fff;font-size:16px;line-height:1;cursor:pointer}
.mem-main{position:absolute;left:4px;bottom:4px;padding:1px 7px;border-radius:999px;background:#3E6050;color:#fff;font-size:11px;font-weight:700}
.mem-add{display:flex;align-items:center;justify-content:center;border:2px dashed #D9C9A8;cursor:pointer;color:#B9975B;font-size:30px;font-weight:700}
.hall-loading{flex-direction:column;gap:14px;letter-spacing:0;font-weight:600}
.hall-loading .dots{display:flex;gap:8px}
.hall-loading .dots b{width:9px;height:9px;border-radius:50%;background:currentColor;opacity:.3;animation:ldot 1.2s ease-in-out infinite}
.hall-loading .dots b:nth-child(2){animation-delay:.2s}
.hall-loading .dots b:nth-child(3){animation-delay:.4s}
@keyframes ldot{0%,100%{opacity:.25;transform:translateY(0)}50%{opacity:1;transform:translateY(-5px)}}
.hang-slot small{font-size:11px;color:var(--muted);white-space:nowrap}
.load-fail{display:flex;flex-direction:column;align-items:center;gap:10px;margin-top:10px}
.load-fail p{margin:0;color:#6D736A;font-size:15px}
.load-fail .btn{min-width:200px;text-align:center}
.niche-ui-actions .niche-ui-main{max-width:none;flex:none;padding:0 40px;font-size:17px;height:56px}
.gal-view.small img{max-width:150px}
.gal-view.guard img{pointer-events:none}
.ph-view{position:relative;display:flex;justify-content:center;align-items:center;background:#111;border-radius:16px;overflow:hidden;margin-bottom:6px}
.ph-view img{max-width:100%;max-height:62vh;display:block;touch-action:pan-y;user-select:none}
.ph-nav{position:absolute;top:50%;transform:translateY(-50%);width:44px;height:44px;border:0;border-radius:50%;background:rgba(255,253,248,.85);color:#2A3530;font-size:28px;line-height:1;cursor:pointer}
.ph-nav.prev{left:8px}.ph-nav.next{right:8px}
.ph-nav[hidden]{display:none}
#ph-count{font-size:13px;font-weight:600;color:var(--muted);margin-left:6px}
