:root { --ink:#f4efe2; --sub:#b9c2e0; --gold:#e8b931; --panel:rgba(14,20,48,.82); --line:rgba(255,255,255,.14);
  --safe-b: env(safe-area-inset-bottom, 0px); --safe-t: env(safe-area-inset-top, 0px); }
* { box-sizing: border-box; -webkit-tap-highlight-color: transparent; }
html, body { margin:0; height:100%; overflow:hidden; background:#070b1f; color:var(--ink);
  font-family: "Pretendard", "Apple SD Gothic Neo", "Noto Sans KR", "Malgun Gothic", system-ui, sans-serif; word-break: keep-all; }
#scene { position:fixed; inset:0; width:100%; height:100%; display:block; touch-action:none; outline:none; }
.topbar { position:fixed; top:calc(10px + var(--safe-t)); left:12px; right:12px; display:flex; justify-content:space-between; align-items:center; pointer-events:none; }
.brand { display:flex; gap:8px; align-items:center; text-shadow:0 1px 6px rgba(0,0,0,.6); }
.brand-lantern { width:30px; height:30px; border-radius:50%; flex:none; filter: drop-shadow(0 0 6px rgba(232,185,49,.45)); }   
.brand-name { font-weight:800; font-size:17px; letter-spacing:-.2px; }
.brand-sub { font-size:11.5px; color:var(--sub); }
.me-chip { pointer-events:auto; display:flex; align-items:center; gap:6px; border:1px solid var(--line); background:var(--panel);
  color:var(--ink); border-radius:999px; padding:7px 11px; font-size:13px; font-family:inherit; backdrop-filter: blur(6px); }
.me-dot { width:8px; height:8px; border-radius:50%; background:var(--gold); box-shadow:0 0 6px var(--gold); }
.me-re { color:var(--sub); }
.status-row { position:fixed; top:calc(52px + var(--safe-t)); left:12px; right:12px; display:flex; flex-wrap:wrap; gap:6px; pointer-events:none; }
.badge { font-size:11px; padding:4px 8px; border-radius:6px; background:rgba(10,14,36,.72); border:1px solid var(--line); color:var(--sub); }
.badge.sample { color:#ffe08a; border-color:rgba(232,185,49,.45); }
.badge.sm { font-size:10px; padding:2px 6px; }

.hint { position:fixed; top:auto; bottom:var(--hint-b, 150px); left:50%; transform:translateX(-50%); z-index:4; font-size:12.5px; background:rgba(10,14,36,.94); box-shadow:0 4px 14px rgba(0,0,0,.35); padding:8px 12px; max-width:calc(100vw - 20px);
  border-radius:999px; border:1px solid var(--line); white-space:nowrap; transition:opacity .8s; pointer-events:none; }
.hint.fade { opacity:0; }
#labels { position:fixed; inset:0; pointer-events:none; }
.tag { position:absolute; transform:translate(-50%,-100%); font-size:11px; font-weight:700; padding:2px 7px; border-radius:999px;
  background:rgba(232,185,49,.92); color:#2a1d00; white-space:nowrap; }
.tag.mine { background:rgba(255,255,255,.92); color:#1a2250; z-index:3; }
.tag.mine-l { z-index:2; }
.bubble { position:fixed; left:0; top:0; width:min(272px, calc(100vw - 24px)); background:rgba(250,246,236,.97); color:#1c2142; border-radius:14px;
  padding:12px 14px 12px; box-shadow:0 10px 30px rgba(0,0,0,.45); transform:translate(-50%, calc(-100% - 14px)); z-index:5; }
.bubble::after { content:""; position:absolute; left:var(--tail, 50%); bottom:-8px; margin-left:-8px; border:8px solid transparent; border-bottom:0; border-top-color:rgba(250,246,236,.97); }
.bubble-x { position:absolute; right:6px; top:4px; border:0; background:none; font-size:20px; color:#6b7091; padding:4px 8px; }
.b-title { font-weight:800; font-size:16px; padding-right:22px; }
.b-title .hanja { color:#8a5a00; }
.b-meta { margin-top:4px; font-size:12px; color:#5b6180; display:flex; gap:6px; align-items:center; flex-wrap:wrap; }
.b-dot { width:10px; height:10px; border-radius:50%; display:inline-block; box-shadow:0 0 0 1px rgba(0,0,0,.15) inset; }
.b-wish { margin-top:8px; font-size:14px; line-height:1.45; }
.b-sample { display:inline-block; font-size:10.5px; color:#8a5a00; background:#fff1c7; border-radius:4px; padding:1px 5px; }
.b-act { margin-top:10px; width:100%; border:0; border-radius:10px; padding:9px; font-weight:700; font-family:inherit; font-size:14px; background:#1c2563; color:#fff; }
.bottom { position:fixed; left:0; right:0; bottom:0; padding:10px 14px calc(8px + var(--safe-b)); background:linear-gradient(to top, rgba(6,9,26,.92) 55%, rgba(6,9,26,0)); text-align:center; }
.make-btn { width:100%; max-width:420px; border:0; border-radius:14px; padding:15px; font-size:17px; font-weight:800; font-family:inherit; color:#2a1d00;
  background:linear-gradient(180deg,#ffd76a,#e8b931); box-shadow:0 0 18px rgba(232,185,49,.45), 0 4px 0 #a7810f; }
.make-btn:active { transform:translateY(2px); box-shadow:0 0 12px rgba(232,185,49,.4), 0 2px 0 #a7810f; }
.make-btn.sm { padding:11px; font-size:15px; margin-top:10px; }
.notice { margin:8px -4px 0; font-size:10px; letter-spacing:-.3px; line-height:1.45; color:#a3acd0; white-space:nowrap; }

@media (max-width:359px) { .notice { white-space:normal; letter-spacing:-.2px; margin:8px auto 0; } }
.hang-btn { position:fixed; left:50%; bottom:calc(122px + var(--safe-b)); transform:translateX(-50%); border:1px solid #ffe08a; background:rgba(20,26,64,.92); color:#ffe08a;
  font-weight:800; font-size:15px; font-family:inherit; padding:11px 20px; border-radius:999px; box-shadow:0 0 16px rgba(255,224,138,.45); }
.toast { position:fixed; left:50%; top:calc(92px + var(--safe-t)); transform:translateX(-50%); background:rgba(250,246,236,.96); color:#1c2142; font-size:13px;
  padding:9px 14px; border-radius:12px; width:max-content; max-width:calc(100vw - 32px); text-align:center; z-index:6;
  word-break:keep-all; text-wrap:balance; box-shadow:0 6px 20px rgba(0,0,0,.35); }
.modal { position:fixed; inset:0; background:rgba(3,5,16,.55); display:flex; align-items:flex-end; justify-content:center; z-index:10; }
.modal[hidden], .bubble[hidden], .toast[hidden], .hang-btn[hidden] { display:none; }
.sheet { width:100%; max-width:480px; height:92%; background:#10173d; border-radius:18px 18px 0 0; border:1px solid var(--line); border-bottom:0;
  display:flex; flex-direction:column; padding:14px 14px calc(12px + var(--safe-b)); animation: up .28s ease-out; }
@keyframes up { from { transform:translateY(40px); opacity:.4; } to { transform:none; opacity:1; } }
.sheet-head { display:flex; justify-content:space-between; align-items:center; }
.sheet-head h2 { margin:0; font-size:18px; }
.sheet-x { border:0; background:none; color:var(--ink); font-size:26px; padding:0 6px; }
.sheet-note { font-size:12.5px; color:var(--sub); margin:6px 0 10px; line-height:1.5; }
.frame-wrap { margin-top:10px; flex:1; min-height:200px; border-radius:12px; overflow:hidden; border:1px solid var(--line); background:#0b1030; }
.frame-wrap iframe { width:100%; height:100%; border:0; display:block; background:#0b1030; }
.proto-box { margin-top:10px; padding:10px; border-radius:12px; border:1px dashed rgba(232,185,49,.45); background:rgba(232,185,49,.05); }
.proto-title { font-size:12.5px; color:#ffe08a; margin-bottom:8px; display:flex; gap:6px; align-items:center; }
.chips { display:flex; gap:6px; }
.chip { flex:1; border:1px solid var(--line); background:rgba(255,255,255,.04); color:var(--ink); border-radius:10px; padding:7px 0; font-size:12.5px; font-family:inherit; }
.chip i { display:block; width:14px; height:14px; border-radius:50%; margin:0 auto 3px; }
.chip[aria-checked="true"] { border-color:#ffe08a; background:rgba(255,224,138,.12); }
#wish-sel { width:100%; margin-top:8px; padding:9px; border-radius:10px; background:#0b1030; color:var(--ink); border:1px solid var(--line); font-family:inherit; font-size:14px; }
.check { display:flex; gap:6px; align-items:center; font-size:12.5px; color:var(--sub); margin-top:8px; }
.nojs { position:fixed; inset:0; display:grid; place-items:center; }


.top-right { display:flex; gap:6px; align-items:center; }
.rank-btn { pointer-events:auto; display:flex; align-items:center; gap:4px; border:1px solid rgba(232,185,49,.5); background:var(--panel); color:#ffe08a;
  border-radius:999px; padding:7px 10px; font-size:13px; font-weight:700; font-family:inherit; backdrop-filter: blur(6px); }
.rank-btn svg { width:14px; height:14px; fill:#ffe08a; }
.me-chip { max-width:150px; } .me-chip #me-name { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.badge.gd { color:#ffe08a; }

.announce { position:fixed; left:50%; transform:translateX(-50%); top:calc(92px + var(--safe-t)); width:calc(100vw - 24px); max-width:420px; z-index:7;
  display:flex; align-items:center; gap:8px; background:rgba(20,26,64,.95); border:1px solid rgba(255,224,138,.55); color:var(--ink); border-radius:14px;
  padding:9px 9px 9px 12px; box-shadow:0 0 18px rgba(255,224,138,.25), 0 6px 20px rgba(0,0,0,.4); animation: drop .25s ease-out; }
.announce[hidden] { display:none; }
.announce.global { border-color:#ffe08a; background:linear-gradient(90deg, rgba(60,44,8,.96), rgba(20,26,64,.96)); }
@keyframes drop { from { transform:translate(-50%,-10px); opacity:0; } to { transform:translate(-50%,0); opacity:1; } }
.an-text { flex:1; min-width:0; font-size:13px; line-height:1.4; word-break:keep-all; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.an-text .an-tag { display:inline-block; font-size:10.5px; color:#2a1d00; background:#ffe08a; border-radius:4px; padding:0 5px; margin-right:4px; font-weight:800; }
.an-text .an-q { color:#ffe9a8; }
.an-cheer, .b-cheer { flex:none; border:0; border-radius:999px; padding:7px 11px; font-weight:800; font-size:12.5px; font-family:inherit; color:#2a1d00; background:linear-gradient(180deg,#ffd76a,#e8b931); }
.an-cheer[hidden] { display:none; }
.an-cheer:disabled, .b-cheer:disabled { background:rgba(255,255,255,.18); color:#d9dcf0; }

.burst { position:fixed; left:0; top:0; pointer-events:none; z-index:9; }
.burst i { position:absolute; width:7px; height:7px; border-radius:50%; background:#ffe08a; box-shadow:0 0 8px #ffe08a; animation: pop .9s ease-out forwards; }
.burst i:nth-child(3n) { background:#ff9ab3; box-shadow:0 0 8px #ff9ab3; } .burst i:nth-child(3n+1) { background:#9fe8ff; box-shadow:0 0 8px #9fe8ff; }
.burst b { position:absolute; transform:translate(-50%,-50%); font-size:13px; font-weight:800; color:#ffe08a; text-shadow:0 1px 6px rgba(0,0,0,.6); white-space:nowrap; animation: rise 1.1s ease-out forwards; }
@keyframes pop { from { transform:translate(0,0) scale(1); opacity:1; } to { transform:translate(var(--dx),var(--dy)) scale(.4); opacity:0; } }
@keyframes rise { from { transform:translate(-50%,-50%); opacity:1; } to { transform:translate(-50%,-160%); opacity:0; } }

.b-prayer { margin-top:8px; padding:8px 10px; border-radius:10px; background:#fff4d2; font-size:13.5px; line-height:1.45; color:#3a2a00; }
.b-prayer .lbl { display:block; font-size:10.5px; color:#8a5a00; font-weight:700; margin-bottom:2px; }
.b-prayer.private { background:#eef0fa; color:#2a3060; } .b-prayer.private .lbl { color:#5b6180; }
.b-prayer.hidden { background:#f1f1f4; color:#6b7091; }
.b-row { margin-top:10px; display:flex; gap:6px; align-items:center; }
.b-row .b-act { margin-top:0; flex:1; }
.b-cheer { flex:1; padding:9px; font-size:14px; }
.b-report { border:0; background:none; color:#8a8fa8; font-size:12px; font-family:inherit; text-decoration:underline; padding:6px 4px; }
.b-gd { margin-top:6px; font-size:11px; color:#6b7091; }

.sheet.small { height:auto; max-height:92%; overflow:auto; gap:0; }
.seg { display:flex; gap:6px; margin:12px 0 10px; }
.seg button { flex:1; border:1px solid var(--line); background:rgba(255,255,255,.04); color:var(--ink); border-radius:12px; padding:10px 6px; font-size:14.5px; font-weight:800; font-family:inherit; }
.seg button small { display:block; font-size:11px; font-weight:400; color:var(--sub); margin-top:2px; }
.seg button[aria-checked="true"] { border-color:#ffe08a; background:rgba(255,224,138,.14); color:#ffe08a; }
.field-label { font-size:13px; color:var(--sub); margin-bottom:6px; } .muted { color:#8a93b8; font-size:12px; }
#pray-text { width:100%; resize:none; border-radius:12px; border:1px solid var(--line); background:#0b1030; color:var(--ink); padding:10px 12px; font-family:inherit; font-size:15px; line-height:1.45; }
#pray-text:focus { outline:none; border-color:#ffe08a; }
.pray-row { display:flex; justify-content:space-between; align-items:flex-start; gap:8px; min-height:18px; margin-top:4px; }
.pray-err { margin:0; font-size:12.5px; color:#ffb3a8; } .counter { font-size:12px; color:var(--sub); flex:none; } .counter.full { color:#ffe08a; }
.pray-guide { font-size:12px; line-height:1.55; color:var(--sub); margin:6px 0 4px; }
.check.optin { align-items:flex-start; font-size:13px; color:var(--ink); padding:9px 10px; border-radius:10px; background:rgba(255,224,138,.07); border:1px solid rgba(255,224,138,.3); }
.check.optin[hidden] { display:none; } .check.optin input { margin-top:3px; width:16px; height:16px; flex:none; }

.rank-sub { font-size:12px; color:var(--sub); margin:6px 0 8px; line-height:1.5; }
.rank-list { list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:4px; }
.rank-list li { display:flex; align-items:center; gap:10px; padding:8px 10px; border-radius:10px; background:rgba(255,255,255,.04); font-size:14px; }
.rank-list li .no { width:22px; text-align:center; font-weight:800; color:var(--sub); } .rank-list li:nth-child(-n+3) .no { color:#ffe08a; }
.rank-list li .nm { flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } .rank-list li .nm .hanja { color:#ffe08a; margin-right:4px; }
.rank-list li .ct { font-size:12.5px; color:var(--sub); flex:none; }
.rank-list li.me { background:rgba(255,224,138,.16); border:1px solid rgba(255,224,138,.55); } .rank-list li.me .nm::after { content:" · 내 등"; color:#ffe08a; font-size:12px; }
.rank-list li.gap { background:none; justify-content:center; color:var(--sub); font-size:12px; padding:2px; }
.gd-box { margin-top:12px; padding:10px 12px; border-radius:12px; border:1px solid var(--line); background:rgba(255,255,255,.03); }
.gd-head { font-size:14px; } .gd-head b { color:#ffe08a; font-size:16px; margin-left:4px; }
.gd-rule { font-size:11.5px; color:var(--sub); margin:4px 0 8px; }
.gd-items { display:flex; gap:6px; } .gd-items > * { flex:1; min-width:0; border-radius:10px; border:1px dashed var(--line); background:transparent; padding:7px 4px; text-align:center; font:inherit; font-size:11.5px; color:var(--sub); line-height:1.35; cursor:pointer; }
.gd-items > * b { display:block; color:var(--ink); font-size:12px; } .gd-items > .open { border-style:solid; border-color:#ffe08a; color:#ffe08a; } .gd-items > *[aria-disabled="true"] { cursor:default; }
.gd-items > .on { background:rgba(255,224,138,.16); box-shadow:0 0 0 1px #ffe08a inset; } .gd-items small { font-size:10.5px; }

.npc-say { position:fixed; z-index:6; transform:translate(-50%,-100%); max-width:176px; padding:6px 10px; border-radius:12px; background:rgba(255,252,240,.95); color:#3a2c1a; font-size:12.5px; line-height:1.35; text-align:center; pointer-events:none; box-shadow:0 2px 8px rgba(0,0,0,.25); animation:npcSayIn .25s ease-out; }
.npc-say::after { content:''; position:absolute; left:50%; bottom:-6px; margin-left:-6px; border:6px solid transparent; border-bottom:0; border-top-color:rgba(255,252,240,.95); }
@keyframes npcSayIn { from { opacity:0; transform:translate(-50%,-80%); } to { opacity:1; transform:translate(-50%,-100%); } }
.npc-say.out { opacity:0; transition:opacity .2s ease-out; }   
@media (prefers-reduced-motion: reduce) { .npc-say { animation:none; } }
.gd-note { font-size:11.5px; color:#9aa3c7; margin:8px 0 0; line-height:1.5; }
.modal[hidden] { display:none; }


.top-right { gap:5px; }
.me-chip { max-width:132px; }
.menu-btn { pointer-events:auto; width:34px; height:34px; display:grid; place-items:center; border:1px solid var(--line); background:var(--panel); border-radius:50%; padding:0; backdrop-filter: blur(6px); }
.menu-btn svg { width:16px; height:16px; stroke:var(--ink); stroke-width:1.8; stroke-linecap:round; fill:none; }
.menu-list { list-style:none; margin:10px 0 0; padding:0; display:flex; flex-direction:column; gap:6px; }
.menu-list button { width:100%; text-align:left; border:1px solid var(--line); background:rgba(255,255,255,.04); color:var(--ink); font:inherit; font-size:14.5px; padding:12px 12px; border-radius:12px; }
.links-sec { margin-top:14px; }
.links-sec[hidden] { display:none; }
.links-sec h3 { margin:0 0 6px; font-size:13px; color:var(--sub); font-weight:700; }
.link-list { list-style:none; margin:8px 0 0; padding:0; display:flex; flex-direction:column; gap:6px; }
.link-list button { width:100%; display:flex; align-items:center; gap:10px; border:1px solid rgba(255,224,138,.28); background:rgba(255,224,138,.06); color:var(--ink); font:inherit; font-size:14.5px; padding:11px 12px; border-radius:12px; text-align:left; }
.link-list .li-ic { width:22px; height:22px; flex:none; } .link-list .li-ic svg { width:22px; height:22px; display:block; }
.link-list .li-go { margin-left:auto; color:var(--sub); font-size:12px; }
.links-note { font-size:11.5px; color:var(--sub); margin:8px 0 2px; }
.modal.center { align-items:center; padding:20px; }
.dialog { width:100%; max-width:340px; background:#10173d; border:1px solid var(--line); border-radius:16px; padding:18px 16px 14px; animation: up .2s ease-out; }
.dialog h2 { margin:0 0 8px; font-size:17px; }
.leave-host { margin:0; font-size:14px; display:flex; flex-direction:column; gap:2px; } .leave-host span { color:var(--sub); font-size:12.5px; word-break:break-all; }
.leave-sub { font-size:12.5px; color:var(--sub); margin:8px 0 0; }
.leave-row { display:flex; gap:8px; margin-top:12px; } .leave-row > * { flex:1; margin-top:0 !important; }
.leave-row a.make-btn { display:block; text-align:center; text-decoration:none; box-sizing:border-box; }
.ghost-btn { border:1px solid var(--line); background:transparent; color:var(--ink); font:inherit; font-size:15px; border-radius:14px; padding:11px; }


.my-sheet { max-height:86%; overflow:auto; }
.my-own { font-size:11.5px; color:var(--sub); margin:4px 0 10px; line-height:1.5; }
.my-head { display:flex; align-items:center; gap:10px; margin-bottom:8px; }
.my-dot { width:30px; height:38px; border-radius:45% 45% 40% 40%; box-shadow:0 0 14px var(--g); flex:none; display:flex; align-items:center; justify-content:center; font-family:serif; font-weight:700; color:rgba(0,0,0,.5); }
.my-head b { font-size:16px; } .my-head small { display:block; color:var(--sub); font-size:12px; margin-top:2px; }
.my-why { font-size:14px; line-height:1.6; margin:6px 0; } .my-why.sub { color:#e9dfc4; } .my-why.my-hint { font-size:12.5px; color:var(--sub); }
.my-sec { border-top:1px solid var(--line); margin-top:10px; padding-top:10px; }
.my-sec h3 { font-size:13px; margin:0 0 6px; color:#ffe2a0; }
.my-pillars { display:flex; gap:6px; } .my-pillars div { flex:1; text-align:center; background:rgba(255,255,255,.05); border-radius:10px; padding:6px 0; }
.my-pillars small { display:block; font-size:11px; color:var(--sub); } .my-pillars span { display:block; font-family:serif; font-size:20px; line-height:1.25; }
.my-pillars .day { outline:1px solid #ffe2a0; }
.my-kv { display:grid; grid-template-columns:auto 1fr; gap:4px 12px; font-size:13px; } .my-kv dt { color:var(--sub); } .my-kv dd { margin:0; }
.my-ilju-kw { font-weight:700; margin:2px 0; } .my-ilju-tx { font-size:13px; line-height:1.55; margin:0; color:#e9dfc4; }
.hang-btn.pray-now { background:linear-gradient(180deg,#f6e7ff,#cdb6f0); color:#2a1d4a; }

.emote-sec h3 { font-size:14px; margin:12px 0 6px; } .emote-sub { font-size:11.5px; color:var(--sub); font-weight:400; }
.emote-list { display:grid; grid-template-columns:repeat(4,1fr); gap:6px; }
.emote-list button { border:1px solid var(--line); background:rgba(255,255,255,.05); color:var(--ink); border-radius:12px; padding:8px 2px; font:inherit; font-size:13px; }
.emote-list button[aria-checked="true"] { border-color:#ffd76a; background:rgba(255,215,106,.16); font-weight:800; }
.emote-list button:disabled { opacity:.55; } .emote-list small { display:block; font-size:10px; color:var(--sub); margin-top:2px; line-height:1.3; }
.my-del { text-align:center; }
.my-del-btn { border:1px solid rgba(255,140,140,.5); background:transparent; color:#ffb3b3; border-radius:999px; padding:8px 16px; font:inherit; font-size:13px; }
.my-del-ask { background:rgba(255,120,120,.08); border:1px solid rgba(255,140,140,.4); border-radius:12px; padding:10px 12px; text-align:left; }
.my-del-ask p { margin:0 0 8px; font-size:13px; line-height:1.55; }
.my-del-row { display:flex; gap:8px; justify-content:flex-end; }
.my-del-row button { border:1px solid var(--line); background:rgba(255,255,255,.06); color:var(--ink); border-radius:999px; padding:7px 14px; font:inherit; font-size:13px; }
.my-del-row .danger { background:#d9534f; border-color:#d9534f; color:#fff; font-weight:700; }

.burst b.clap-ic { font-size:26px; animation: rise 1.1s ease-out forwards; }
.an-cheer[aria-disabled="true"], .b-cheer[aria-disabled="true"] { background:rgba(255,255,255,.18); color:#d9dcf0; }
.badge.gd.bump { animation: gdbump .8s ease-out; background:rgba(232,185,49,.35); }
@keyframes gdbump { 0% { transform:scale(1); } 30% { transform:scale(1.25); } 100% { transform:scale(1); } }
@media (prefers-reduced-motion: reduce) { .burst b, .burst b.clap-ic, .burst b.gd-label { animation:none; } .badge.gd.bump { animation:none; } }


.quick-btn { pointer-events:auto; border:1px solid #ffe08a; background:rgba(255,224,138,.16); color:#ffe08a; border-radius:999px; padding:6px 11px; font:600 12.5px/1 inherit; font-family:inherit; white-space:nowrap; }
.quick-btn.mine { background:rgba(255,255,255,.08); color:var(--ink); border-color:var(--line); }
.spots { position:fixed; inset:0; pointer-events:none; z-index:4; }
.spot { position:absolute; transform:translate(-50%,-50%); pointer-events:auto; border:1.5px dashed #ffe08a; background:rgba(16,23,61,.72); color:#ffe08a; border-radius:999px;
  min-width:44px; min-height:44px; padding:0 10px; font:600 12px/1 inherit; font-family:inherit; white-space:nowrap; animation: spotpulse 1.8s ease-in-out infinite; }
.spot[hidden] { display:none; }
@keyframes spotpulse { 50% { box-shadow:0 0 0 6px rgba(255,224,138,.15); } }
.hs-sheet { gap:6px; }
.hs-body { flex:1; overflow-y:auto; -webkit-overflow-scrolling:touch; padding:2px 2px 8px; }
.hs-sec { border-top:1px solid var(--line); padding:10px 0; }
.hs-sec:first-child { border-top:0; padding-top:2px; }
.hs-body .field-label { display:block; font-size:13px; font-weight:600; margin:8px 0 5px; }
.hs-body .muted { color:var(--sub); font-weight:400; }
.seg3 { display:flex; gap:6px; flex-wrap:wrap; }
.seg3 label { flex:1; min-width:30%; }
.seg3 input { position:absolute; opacity:0; pointer-events:none; }
.seg3 span { display:block; text-align:center; border:1px solid var(--line); border-radius:10px; padding:9px 4px; font-size:13px; min-height:20px; }
.seg3 input:checked + span { border-color:#ffe08a; background:rgba(255,224,138,.12); color:#ffe08a; }
.hs-row3, .hs-row2 { display:grid; grid-template-columns:1.3fr 1fr 1fr; gap:6px; }
.hs-row2 { grid-template-columns:1fr 1fr; margin-top:6px; }
.hs-body select, .hs-body input[type=text], .hs-body textarea { width:100%; box-sizing:border-box; min-height:44px; background:#0b1030; color:var(--ink); border:1px solid var(--line); border-radius:10px; padding:8px; font:15px inherit; font-family:inherit; }
.hs-body select:disabled { opacity:.45; }
.hs-body .check, .hs-body .radio { display:flex; gap:8px; align-items:flex-start; font-size:13px; line-height:1.45; margin:7px 0; }
.hs-body .check input, .hs-body .radio input { width:20px; height:20px; flex:none; margin:0; }
.hs-fold summary { font-size:12.5px; color:var(--sub); padding:8px 0; }
.hs-preview { text-align:center; }
.hs-stage { display:flex; align-items:center; justify-content:center; gap:10px; }
.hs-arrow { width:44px; height:44px; border-radius:50%; border:1px solid var(--line); background:rgba(255,255,255,.05); color:var(--ink); font-size:24px; line-height:1; }
.hs-lantern { width:110px; height:142px; display:flex; align-items:center; justify-content:center; touch-action:pan-y; user-select:none; }
.hs-lantern.pending svg { filter:grayscale(.85) brightness(.75); }
.hs-shape-name { margin:2px 0 4px; font-size:14px; font-weight:700; color:#ffe08a; }
.hs-dots { display:flex; justify-content:center; gap:4px; }
.hs-dots button { width:28px; height:28px; border:0; background:none; padding:0; position:relative; }
.hs-dots button::after { content:''; position:absolute; left:50%; top:50%; width:8px; height:8px; margin:-4px; border-radius:50%; background:#4a5384; }
.hs-dots button[aria-selected="true"]::after { background:#ffe08a; width:18px; margin-left:-9px; border-radius:4px; }
.hs-wait { font-size:12.5px; color:var(--sub); line-height:1.5; margin:8px 0 0; }
.hs-why { text-align:left; background:rgba(255,224,138,.07); border:1px solid rgba(255,224,138,.25); border-radius:12px; padding:9px 11px; margin-top:8px; font-size:12.5px; line-height:1.55; }
.hs-why p { margin:0 0 4px; } .hs-why[hidden], .hs-why p[hidden] { display:none; }
.hs-tabs { display:flex; gap:5px; overflow-x:auto; padding-bottom:4px; }
.hs-tabs button { flex:none; border:1px solid var(--line); background:none; color:var(--sub); border-radius:999px; padding:7px 11px; font:12.5px inherit; font-family:inherit; min-height:36px; }
.hs-tabs button[aria-selected="true"] { color:#10173d; background:#ffe08a; border-color:#ffe08a; }
.hs-chips { display:flex; flex-direction:column; gap:5px; margin-top:6px; }
.hs-chips button { text-align:left; border:1px solid var(--line); background:rgba(255,255,255,.03); color:var(--ink); border-radius:10px; padding:10px; font:13.5px inherit; font-family:inherit; min-height:44px; }
.hs-chips button[aria-checked="true"] { border-color:#ffe08a; background:rgba(255,224,138,.12); }
.hs-notices .notice, .hs-body .notice { white-space:normal; margin:0 0 6px; font-size:11.5px; letter-spacing:-.2px; }
#hs-ok { width:100%; margin-top:6px; min-height:48px; }
.hs-legal { text-align:center; font-size:11.5px; color:var(--sub); margin:10px 0 0; }
.link-btn { border:0; background:none; color:inherit; text-decoration:underline; font:inherit; padding:4px 2px; }
#legal .sheet { padding-bottom:0; } #legal-frame { flex:1; width:100%; border:0; border-radius:10px; background:#fff; }
.menu-legal { display:flex; flex-wrap:wrap; gap:4px 10px; font-size:12.5px; color:var(--sub); }
@media (prefers-reduced-motion: reduce) { .spot { animation:none; } }

@media (max-width:440px) {
  .brand-sub { display:none; } .brand-name { white-space:nowrap; font-size:15.5px; } .brand { gap:5px; }
  .rank-btn { font-size:0; gap:0; padding-left:9px; padding-right:9px; } .rank-btn svg { width:15px; height:15px; }
  .me-chip { max-width:104px; } .top-right { gap:4px; min-width:0; }
  .brand { flex:none; margin-right:8px; } .brand-lantern { width:26px; height:26px; }   
}
#hs [hidden], #legal [hidden], .spots [hidden] { display:none !important; }

.carry-x { position:fixed; left:50%; bottom:calc(180px + var(--safe-b)); transform:translateX(-50%); z-index:6; border:1px solid var(--line); background:rgba(16,23,61,.85); color:var(--sub);
  border-radius:999px; padding:0 14px; min-height:36px; font:12.5px inherit; font-family:inherit; white-space:nowrap; }
.carry-x[hidden] { display:none; }

.bottom-row { display:flex; gap:8px; max-width:420px; margin:0 auto; }
.bottom-row .make-btn { flex:1; min-width:0; }
.act-btn { flex:0 0 auto; min-width:104px; border:1px solid #ffe08a; border-radius:14px; background:rgba(20,26,64,.92); color:#ffe08a; font:800 15px inherit; font-family:inherit; padding:0 12px; }
.act-btn.cool { opacity:.6; border-color:var(--line); color:var(--sub); }
.act-list { position:absolute; right:14px; bottom:calc(100% - 4px); display:flex; flex-direction:column; gap:6px; padding:8px; border-radius:14px; background:rgba(16,23,61,.96); border:1px solid var(--line); box-shadow:0 8px 24px rgba(0,0,0,.4); z-index:7; }
.act-list[hidden] { display:none; }
.act-list button { min-width:132px; min-height:44px; display:flex; align-items:center; gap:8px; border:0; border-radius:10px; background:rgba(255,255,255,.06); color:#fff; font:700 15px inherit; font-family:inherit; padding:0 12px; text-align:left; }
.act-list button[aria-disabled="true"] { opacity:.45; }
.act-ic { font-size:20px; }

.mine-acts { position:fixed; left:50%; bottom:max(calc(122px + var(--safe-b)), calc(var(--hint-b, 0px) + 6px)); transform:translateX(-50%); display:flex; gap:10px; z-index:6; }
.mine-acts[hidden] { display:none; }
.mine-acts .hang-btn { position:static; transform:none; left:auto; bottom:auto; }
.hang-btn.lap-dance { background:linear-gradient(180deg,#fff1c9,#ffd36b); color:#3a2a00; }

.tag .only-me { display:inline-block; margin-left:5px; padding:0 5px; border-radius:6px; font-size:0.78em; font-weight:600; background:rgba(60,40,0,.14); opacity:.9; vertical-align:1px; }


.toast { transition:opacity .4s ease; z-index:70; }   
.toast.block { background:rgba(255,243,240,.97); color:#7a1d10; border:1px solid #e9b7aa; pointer-events:none; }
.toast.fade { opacity:0; }

.my-gy .gy-name { font-size:14px; margin:0 0 4px; color:#ffe2a0; }
.my-gy .gy-one { font-weight:700; margin:2px 0 4px; font-size:14px; }
.my-gy .gy-three { margin:0; padding-left:18px; font-size:13px; line-height:1.55; color:#e9dfc4; }
.my-gy .gy-more summary { cursor:pointer; list-style:none; display:flex; align-items:center; justify-content:center; gap:6px; box-sizing:border-box; width:100%; min-height:48px; padding:12px 16px; font-size:16px; font-weight:700; color:var(--gold); border:1.5px solid var(--gold); border-radius:12px; background:rgba(232,185,49,.10); -webkit-tap-highlight-color:transparent; user-select:none; }
.my-gy .gy-more summary::-webkit-details-marker { display:none; }
.my-gy .gy-more summary::after { content:"▾"; font-size:14px; }
.my-gy .gy-more[open] summary::after { content:"▴"; }
.my-gy .gy-more summary:focus-visible { outline:2px solid var(--gold); outline-offset:2px; }
.my-gy .gy-sec h4 { margin:8px 0 2px; font-size:13px; color:#ffe2a0; }
.my-gy .gy-sec p { margin:0; font-size:13px; line-height:1.55; color:#e9dfc4; }
.my-gy .gy-notice { margin:8px 0 0; font-size:11px; color:var(--sub); }

.hang-btn.sit-btn { background:linear-gradient(180deg,#f3e3c8,#d9b98a); color:#3a2612; border-color:#f3e3c8; }
.hang-btn.sit-btn.seated { background:rgba(20,26,64,.92); color:#f3e3c8; }

.brand, #count-badge { cursor:pointer; }
.yard-list { list-style:none; margin:4px 0 6px; padding:0; display:flex; flex-direction:column; gap:7px; }
.yd-card { width:100%; display:flex; align-items:center; gap:10px; text-align:left; border:1px solid var(--line); background:rgba(255,255,255,.04); color:var(--ink); font:inherit; padding:10px 11px; border-radius:12px; }
.yd-card.rec { border-color:rgba(232,185,49,.7); background:rgba(232,185,49,.1); }
.yd-card.here { box-shadow:inset 0 0 0 1px rgba(255,255,255,.25); }
.yd-card:disabled { opacity:.5; }
.yd-dot { flex:none; width:32px; height:32px; border-radius:50%; display:grid; place-items:center; font-weight:800; font-size:15px; color:#fff; text-shadow:0 1px 3px rgba(0,0,0,.6); box-shadow:0 0 10px var(--g, transparent); }
.yd-dot.base { background:#26306a; }
.yd-txt { flex:1; min-width:0; display:flex; flex-direction:column; gap:2px; }
.yd-txt b { font-size:14px; } .yd-txt small { font-size:11.5px; color:var(--sub); line-height:1.4; }
.yd-tags { flex:none; display:flex; flex-direction:column; align-items:flex-end; gap:3px; }
.yd-tag { font-style:normal; font-size:10.5px; padding:2px 6px; border-radius:6px; border:1px solid var(--line); color:var(--sub); white-space:nowrap; }
.yd-tag.rec { color:#ffe08a; border-color:rgba(232,185,49,.6); } .yd-tag.here { color:#bfe9d0; }

.my-share { text-align:center; }
.my-share-btn { border:1px solid rgba(232,185,49,.7); background:rgba(232,185,49,.12); color:#ffe2a0; border-radius:999px; padding:9px 20px; font:inherit; font-size:14px; font-weight:700; }
.share-panel[hidden] { display:none; }
.share-notice { font-size:12.5px; line-height:1.55; color:#e9e2cf; background:rgba(255,255,255,.06); border:1px solid var(--line); border-radius:10px; padding:8px 10px; margin:0 0 8px; text-align:left; }
.share-btns { display:flex; flex-direction:column; gap:8px; }
.share-btns button, .sc-btns button { font:inherit; font-size:14px; border-radius:12px; padding:11px 12px; border:1px solid var(--line); background:rgba(255,255,255,.08); color:#faf6ec; }
.share-btns .primary, .sc-btns .primary { background:#e8b931; color:#1c2142; border-color:#e8b931; font-weight:700; }
.shared-card { position:fixed; left:12px; right:12px; bottom:calc(84px + env(safe-area-inset-bottom, 0px)); z-index:8; background:rgba(14,19,48,.94); border:1px solid rgba(232,185,49,.45); border-radius:16px; padding:12px 14px; color:#faf6ec; box-shadow:0 8px 24px rgba(0,0,0,.4); max-width:480px; margin:0 auto; }
.shared-card[hidden] { display:none; }
.shared-card h2 { margin:2px 0 4px; font-size:17px; color:#ffe2a0; }
.sc-kicker { font-size:11.5px; color:#cfc6ae; }
.sc-meta { font-size:13px; color:#d9d2bf; display:flex; align-items:center; gap:6px; flex-wrap:wrap; }
.sc-prayer { margin:8px 0 0; font-size:14px; line-height:1.5; }
.sc-btns { display:flex; gap:8px; margin-top:10px; }
.sc-btns button { flex:1; }
.tag.shared-l { background:rgba(232,185,49,.95); color:#1c2142; font-weight:700; }
.share-opt { display:flex; align-items:center; gap:8px; font-size:14px; margin:2px 0 6px; }
.share-opt input { width:18px; height:18px; accent-color:#e8b931; }
.share-opt small, .share-inc { font-size:12px; color:#cfc6ae; }
.share-inc { margin:0 0 6px; text-align:left; }
.sc-ref { margin:4px 0 0; font-size:11.5px; color:#cfc6ae; }
.sc-ref[hidden] { display:none; }
.sc-btns button:disabled { opacity:.7; }

.sc-btns { gap:6px; }
.sc-btns button { white-space:nowrap; padding:11px 6px; font-size:13.5px; letter-spacing:-0.02em; min-width:0; }
.sc-btns #shared-make { flex:1.25; }
.sc-gy { margin:6px 0 0; font-size:13.5px; color:#ffe2a0; line-height:1.45; }
.sc-gy[hidden] { display:none; }
.sc-quiz { display:block; width:100%; margin-top:8px; font:inherit; font-size:13.5px; padding:9px 8px; border-radius:12px; border:1px dashed rgba(232,185,49,.6); background:transparent; color:#ffe2a0; white-space:nowrap; }
.card-view { position:fixed; inset:0; z-index:40; background:rgba(5,8,22,.92); display:flex; flex-direction:column; align-items:center; justify-content:center; padding:56px 16px 24px; }
.card-view[hidden] { display:none; }
.card-view img { max-width:100%; max-height:calc(100% - 40px); border-radius:12px; box-shadow:0 8px 30px rgba(0,0,0,.5); -webkit-touch-callout:default; user-select:auto; }
.card-view-x { position:absolute; top:10px; right:12px; width:40px; height:40px; border-radius:20px; border:1px solid rgba(255,255,255,.3); background:rgba(255,255,255,.1); color:#fff; font-size:24px; line-height:1; }
.card-view-hint { margin:12px 0 0; color:#ffe2a0; font-size:14px; }
.sc-img { display:block; width:100%; border-radius:10px; margin:0 0 8px; }
.sc-img[hidden] { display:none; }
.sc-main { display:block; width:100%; margin-top:10px; font:inherit; font-size:15px; font-weight:700; padding:12px; border-radius:12px; border:0; background:#e8b931; color:#1c2142; }
.sc-look { display:block; margin:6px auto 0; font:inherit; font-size:13px; padding:6px 10px; border:0; background:transparent; color:#d9d2bf; text-decoration:underline; }


body.shared-open .bottom-row, body.shared-open #announce { display: none !important; }

.badge.empty-yard { color:#e9eefc; border-color:rgba(255,224,138,.35); background:rgba(20,26,60,.72); }


.share-row { display:flex; gap:6px; justify-content:space-between; margin-top:10px; }
.share-row button { flex:1 1 0; min-width:0; font:inherit; font-size:12.5px; line-height:1.25; display:flex; flex-direction:column; align-items:center; gap:6px; padding:10px 2px; border-radius:14px; border:1px solid var(--line); background:rgba(255,255,255,.06); color:#faf6ec; word-break:keep-all; -webkit-tap-highlight-color:transparent; }
.share-row button[hidden] { display:none; }
.share-row .si { width:46px; height:46px; border-radius:23px; background:rgba(232,185,49,.18); display:flex; align-items:center; justify-content:center; font-size:22px; }
.share-row .si-kakao { background:#fee500; }
.share-ext { margin:10px 0 0; text-align:center; }

.my-share .share-opt { justify-content:center; }
.my-share-btn.share-main { display:block; width:100%; min-height:48px; margin:4px 0 0; padding:12px 16px; font-size:16px; border-radius:12px; border:1.5px solid var(--gold); background:rgba(232,185,49,.16); color:#ffe2a0; -webkit-tap-highlight-color:transparent; }
.share-row.share-mini { justify-content:center; gap:8px; margin-top:10px; }
.share-row.share-mini button { flex:0 1 auto; flex-direction:row; gap:4px; padding:7px 11px; font-size:12.5px; border-radius:999px; }
.share-row.share-mini .si { width:auto; height:auto; background:none; font-size:14px; border-radius:0; }
.share-ext[hidden] { display:none; }
.share-ext button { font:inherit; font-size:12px; background:none; border:0; color:#c9c3b3; text-decoration:underline; padding:6px; }

@property --rest-p { syntax:'<percentage>'; inherits:false; initial-value:0%; }
.an-cheer, .b-cheer { position:relative; }
.an-cheer.resting, .b-cheer.resting { filter:saturate(.35) brightness(.78); }
.rest-ring { display:none; position:absolute; right:7px; top:50%; width:14px; height:14px; margin-top:-7px; border-radius:50%; pointer-events:none;
  background:conic-gradient(#2a1d00 var(--rest-p), rgba(42,29,0,.22) 0); -webkit-mask:radial-gradient(circle, transparent 4px, #000 4.5px); mask:radial-gradient(circle, transparent 4px, #000 4.5px); }
.resting > .rest-ring { display:block; animation:restfill var(--rest-ms,3000ms) linear forwards; }
@keyframes restfill { from { --rest-p:0%; } to { --rest-p:100%; } }
@media (prefers-reduced-motion: reduce) { .resting > .rest-ring { animation-timing-function:steps(3); } }
.an-cheer.resting { padding-right:26px; }

.fun-foot .yt-link { display:inline-flex; align-items:center; justify-content:center; width:44px; height:44px; margin:-15px -8px -15px 2px; vertical-align:middle; color:#a3acd0; border-radius:10px; }
.fun-foot .yt-link:hover, .fun-foot .yt-link:focus-visible { color:#ff4e45; }
.fun-foot .yt-link:focus-visible { outline:2px solid #ffd76a; outline-offset:-4px; }
body.shared-open .yt-link { display:none; }


.report-note { position:fixed; left:50%; top:calc(92px + var(--safe-t)); transform:translateX(-50%); z-index:7; box-sizing:border-box; width:calc(100vw - 24px); max-width:420px;
  background:#faf6ec; color:#1c2142; border-radius:14px; padding:12px 14px 10px; box-shadow:0 6px 20px rgba(0,0,0,.35); font-size:13.5px; line-height:1.55; word-break:keep-all; }
.report-note[hidden] { display:none; }
.report-note p { margin:0; }
.report-note a { color:#1b4fb8; font-weight:700; text-decoration:underline; overflow-wrap:anywhere; user-select:text; -webkit-user-select:text; }
.report-note-x { display:block; margin:8px 0 0 auto; min-height:36px; min-width:64px; padding:6px 14px; border:0; border-radius:10px; background:#1c2142; color:#fff; font-size:13px; font-weight:700; }


.status-row { justify-content:center; align-items:center; }
.pill-wrap { position:relative; flex:0 0 100%; display:flex; justify-content:center; min-width:0; pointer-events:none; }
.pill-wrap > .yard-pill { pointer-events:auto; }
.status-row { row-gap:5px; }
.yard-pill { display:inline-flex; align-items:center; gap:5px; max-width:calc(100vw - 150px); padding:5px 11px 5px 9px; border-radius:999px; background:rgba(10,14,36,.82); border:1px solid rgba(255,224,138,.4); color:#f3ecd8; font:600 12.5px/1.2 inherit; font-family:inherit; cursor:pointer; white-space:nowrap; box-shadow:0 2px 10px rgba(0,0,0,.35); }
.yard-pill[hidden] { display:none; }
.yard-pill:active { transform:scale(.97); }
.yard-pill .yp-dot { width:8px; height:8px; border-radius:50%; flex:none; box-shadow:0 0 6px currentColor; }
.yard-pill .yp-sym { font-size:13px; }
.yard-pill .yp-name { overflow:hidden; text-overflow:ellipsis; }
.yard-pill .yp-n { color:var(--sub); font-weight:500; font-size:11.5px; }
.yard-pill .yp-n[hidden] { display:none; }
.yard-pill .yp-car { color:#ffe08a; font-size:11px; }
.pill-tip { position:absolute; top:calc(100% + 8px); left:50%; max-width:calc(100vw - 24px); transform:translateX(-50%); white-space:nowrap; background:rgba(250,246,236,.97); color:#1c2142; font-size:12.5px; font-weight:600; padding:7px 11px; border-radius:10px; box-shadow:0 4px 14px rgba(0,0,0,.35); z-index:8; pointer-events:none; animation:piltip .3s ease-out; }
.pill-tip::before { content:""; position:absolute; top:-6px; left:50%; margin-left:-6px; border:6px solid transparent; border-top:0; border-bottom-color:rgba(250,246,236,.97); }
.pill-tip[hidden] { display:none; }
@keyframes piltip { from { opacity:0; transform:translate(-50%, -4px); } to { opacity:1; transform:translate(-50%, 0); } }
@media (prefers-reduced-motion: reduce) { .pill-tip { animation:none; } }
.yd-sym { font-size:20px; width:26px; text-align:center; flex:none; }
.yd-check { margin-left:auto; color:#ffe08a; font-weight:800; font-size:18px; padding-left:8px; flex:none; }


#rank-list li.fill .ct { color:var(--sub); font-size:11px; }
#rank-list li.fill .no { color:var(--sub); }
.badge.guests { color:var(--sub); }


.act-list button { position:relative; }
.act-list button small { margin-left:auto; font-size:12px; font-weight:700; color:var(--sub); }
.act-list button.locked { opacity:.6; }
.act-list button.locked small { color:#ffe08a; }
.act-list button.on { background:rgba(255,224,138,.16); box-shadow:inset 0 0 0 1px #ffe08a; }
.stop-act { flex:0 0 auto; min-width:64px; border:1px solid #ff9a8a; border-radius:14px; background:rgba(64,20,30,.92); color:#ffd0c8; font:800 15px inherit; font-family:inherit; padding:0 12px; }
.stop-act[hidden], .afk-btn[hidden] { display:none; }
.afk-btn { position:absolute; left:50%; bottom:calc(100% + 10px); transform:translateX(-50%); min-height:48px; padding:0 20px; border-radius:24px; border:1px solid #ffe08a; background:rgba(20,26,64,.96); color:#ffe08a; font:800 16px inherit; font-family:inherit; box-shadow:0 6px 20px rgba(0,0,0,.45); z-index:8; white-space:nowrap; }
.plus-float, .burst b.gd-label { font-family:inherit; font-size:21px; font-weight:800; letter-spacing:.02em; color:#ffd65c; white-space:nowrap; pointer-events:none;
  text-shadow:0 0 1px #2a1800, 1.5px 0 0 #2a1800, -1.5px 0 0 #2a1800, 0 1.5px 0 #2a1800, 0 -1.5px 0 #2a1800, 1px 1px 0 #2a1800, -1px -1px 0 #2a1800, 1px -1px 0 #2a1800, -1px 1px 0 #2a1800, 0 2px 8px rgba(0,0,0,.75); }   
.plus-float { position:fixed; transform:translate(-50%,-100%); z-index:9; animation:plusUp 1.8s ease-out forwards; }
.plus-float.still { animation:plusFade 1.8s linear forwards; }
.plus-float.moved { transition:left .15s ease-out, top .15s ease-out; }
@keyframes plusUp { 0% { opacity:0; transform:translate(-50%,-100%) scale(.55); } 12% { opacity:1; transform:translate(-50%,-100%) scale(1.18); } 22% { transform:translate(-50%,-100%) scale(1); } 70% { opacity:1; transform:translate(-50%,calc(-100% - 18px)) scale(1); } 100% { opacity:0; transform:translate(-50%,calc(-100% - 34px)) scale(1); } }
.burst b.gd-label { font-size:19px; animation:gdRise 1.8s ease-out forwards; }
@keyframes gdRise { 0% { opacity:0; transform:translate(-50%,-50%) scale(.55); } 12% { opacity:1; transform:translate(-50%,-50%) scale(1.18); } 22% { transform:translate(-50%,-50%) scale(1); } 70% { opacity:1; transform:translate(-50%,calc(-50% - 16px)); } 100% { opacity:0; transform:translate(-50%,calc(-50% - 30px)); } }
@keyframes plusFade { 0% { opacity:0; } 6%,78% { opacity:1; } to { opacity:0; } }


.find-row { max-width:420px; margin:0 auto 6px; display:flex; }
.find-row:has(> [hidden]) { display:none; }
.find-mine { min-height:34px; padding:0 14px; border-radius:18px; border:1px solid var(--line); background:rgba(16,23,61,.9); color:#ffe08a; font:700 13.5px inherit; font-family:inherit; box-shadow:0 4px 14px rgba(0,0,0,.35); z-index:6; }
.find-mine[hidden] { display:none; }
.afk-btn { bottom:calc(100% + 52px); }

.loader { position:fixed; inset:0; z-index:100; display:flex; align-items:center; justify-content:center; background:#0b1230; transition:opacity .3s ease; --glow:.25; }
.loader[hidden] { display:none; }
.loader.out { opacity:0; pointer-events:none; transition-delay:.18s; }   
.ld-lantern { transform-origin:50% 0; animation:ldSway 2.6s ease-in-out infinite; filter:drop-shadow(0 0 calc(18px * var(--glow)) rgba(255,190,90,calc(.75 * var(--glow)))); }
#ld-fill { transition:y .35s ease, height .35s ease; }
@keyframes ldSway { 0%,100% { transform:rotate(-4deg); } 50% { transform:rotate(4deg); } }
@media (prefers-reduced-motion: reduce) { .ld-lantern { animation:none; } }
body.acts-open .hint { visibility:hidden; }   


.rank-list li { padding:0; }
.rank-list li.gap { padding:2px; }
.rank-list li .rk-row { all:unset; box-sizing:border-box; display:flex; align-items:center; gap:10px; width:100%; padding:8px 10px; cursor:pointer; border-radius:10px; -webkit-tap-highlight-color:transparent; }
.rank-list li .rk-row:focus-visible { outline:2px solid var(--gold); outline-offset:-2px; }
.rank-list li .rk-row:active { background:rgba(255,255,255,.06); }
.rcard { z-index:60; align-items:center; }
.rc-sheet { width:min(92%,380px); height:auto; border-radius:18px; border-bottom:1px solid var(--line); padding-bottom:16px; }
.rc-body .b-title { font-weight:800; font-size:16px; margin:4px 0 4px; }
.rc-body .b-meta { font-size:12.5px; color:var(--sub); display:flex; align-items:center; gap:6px; }
.rc-body .b-dot { width:10px; height:10px; border-radius:50%; display:inline-block; }
.rc-body .b-wish { margin:8px 0 4px; font-size:14px; }
.rc-body .b-gd { font-size:12.5px; color:var(--sub); margin-top:6px; }
.my-reread .my-share-btn:disabled { opacity:.45; cursor:default; }
.my-reread .my-hint { font-size:12.5px; color:var(--sub); margin:6px 0 0; text-align:center; }
#resview { z-index:62; }
.rv-sheet { overflow:auto; }
.rv-lantern { display:flex; justify-content:center; margin:6px 0 4px; }
.rv-title { font-size:15px; line-height:1.6; margin:6px 0; font-weight:700; }
.rv-sub { font-size:14px; line-height:1.6; margin:4px 0 10px; color:#e9dfc4; }
.rv-tag { margin:8px 0 2px; font-size:12px; color:var(--sub); }
.rv-gy .ys { margin:14px 0 0; padding:12px 0 0; border-top:1px solid rgba(255,226,160,.18); }
.rv-gy .ys-title { margin:0 0 6px; color:var(--gold); font-size:16px; }
.rv-gy .ys-sec h4 { margin:10px 0 2px; font-size:13px; color:#ffe2a0; }
.rv-gy .ys-sec p { margin:0; font-size:13px; line-height:1.55; color:#e9dfc4; }
.rv-gy .ys-src { font-size:11.5px; color:var(--sub); margin-top:4px !important; }
.rv-gy .ys-locked { list-style:none; padding:0; margin:10px 0 0; font-size:12.5px; color:var(--sub); }
.rv-gy .ys-next { font-size:12.5px; color:var(--sub); }
.rv-gy .ys-more { margin:8px 0 0; }


.help-btn { pointer-events:auto; position:relative; width:44px; height:44px; margin:-5px -4px; display:grid; place-items:center; border:0; background:none; padding:0; color:var(--ink); }
.help-btn span { width:30px; height:30px; display:grid; place-items:center; border:1px solid var(--line); background:var(--panel); border-radius:50%; font-size:15px; font-weight:700; backdrop-filter: blur(6px); }
.howto-sheet { padding-bottom:max(14px, env(safe-area-inset-bottom)); }
.howto-track { display:flex; overflow-x:auto; scroll-snap-type:x mandatory; scrollbar-width:none; margin:6px -4px 0; }
.howto-track::-webkit-scrollbar { display:none; }
.howto-card { flex:0 0 100%; scroll-snap-align:center; box-sizing:border-box; padding:8px 10px 4px; text-align:center; }
.howto-pic { font-size:46px; line-height:1.2; margin:6px 0 10px; }
.howto-card h3 { margin:0 0 8px; font-size:17px; }
.howto-card p { margin:0 auto; max-width:330px; font-size:14.5px; line-height:1.6; color:var(--ink); word-break:keep-all; }
.howto-card p.howto-small { margin-top:10px; font-size:11.5px; color:var(--sub); }
.howto-foot { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-top:14px; }
.howto-dots { display:flex; gap:7px; }
.howto-dots i { width:7px; height:7px; border-radius:50%; background:rgba(255,255,255,.25); transition:background .2s, transform .2s; }
.howto-dots i.on { background:#ffd98a; transform:scale(1.25); }
.howto-next { min-width:112px; min-height:44px; border:0; border-radius:22px; background:#ffcf6e; color:#2a1a05; font-weight:700; font-size:15px; }
@media (prefers-reduced-motion: reduce) { .howto-track { scroll-behavior:auto; } .howto-dots i { transition:none; } }
@media (max-width:440px) {   
  .me-chip { max-width:86px; padding-left:9px; padding-right:9px; gap:5px; }
  .help-btn { margin:-8px -8px; } .help-btn span { width:28px; height:28px; font-size:14px; }
}
@media (max-width:370px) { .me-chip { max-width:64px; } }



.b-house { display:inline-block; font-size:12px; font-weight:700; color:#fff4d6; background:#6b4a12; border:1px solid #e8b931; border-radius:999px; padding:2px 9px; vertical-align:middle; letter-spacing:.02em; }
.rank-list li .nm .b-house { font-size:11px; padding:1px 7px; margin-right:4px; }
#rank-list li.rk-hello, .rank-list li.rk-hello { flex-direction:column; align-items:flex-start; gap:2px; padding:12px 14px; background:linear-gradient(135deg, rgba(255,224,138,.16), rgba(255,160,90,.08)); border:1px solid rgba(255,224,138,.35); }
.rank-list li.rk-hello b { font-size:15px; color:#ffe08a; } .rank-list li.rk-hello small { font-size:12px; color:var(--sub); }
.rank-list li.rk-hello.small { background:rgba(255,255,255,.03); border:1px dashed rgba(255,255,255,.14); }
#rank-list li.rk-slot, .rank-list li.rk-slot { padding:9px 10px; background:transparent; border:1px dashed rgba(255,224,138,.28); color:var(--sub); }
.rank-list li.rk-slot .no { color:rgba(255,224,138,.55) !important; } .rank-list li.rk-slot .nm { font-size:13px; opacity:.75; }
#rank-list li.fill { background:rgba(255,224,138,.06); }
.rank-house { margin-top:14px; padding-top:12px; border-top:1px solid rgba(255,255,255,.12); }
.rank-house h3 { margin:0 0 2px; font-size:14.5px; color:#ffe9b0; }
.rank-house .rank-sub { margin:0 0 8px; }
.rank-list.house li:nth-child(-n+3) .no { color:#e8d9b0; }


.ld-eave { position:absolute; left:50%; top:calc(50% - 33px - 29px); transform:translateX(-50%); filter:drop-shadow(0 0 6px rgba(255,200,110,.28)); pointer-events:none; }
.ld-title { position:absolute; left:50%; top:calc(50% - 33px - 29px - 22px); transform:translate(-50%,-100%); margin:0; white-space:nowrap; font-family:"Noto Serif KR","Nanum Myeongjo",serif; font-size:19px; line-height:1; font-weight:500; letter-spacing:.34em; padding-left:.34em; color:#f1e3b8; text-shadow:0 0 12px rgba(255,200,110,.32); opacity:.92; pointer-events:none; }   
.loader.ld-plain .ld-eave, .loader.ld-plain .ld-title { display:none; }   
.rv-head h2 { flex:1; text-align:center; font-size:16px; }
.rv-back { flex:none; border:1px solid rgba(255,226,160,.45); background:rgba(255,226,160,.08); color:#ffe2a0; font-size:13px; font-weight:600; border-radius:999px; padding:7px 12px; min-height:36px; white-space:nowrap; }   


.gc-sheet{--text:#f3eee2;--line:rgba(255,255,255,.12);font-family:-apple-system,BlinkMacSystemFont,"Apple SD Gothic Neo","Noto Sans KR","Malgun Gothic",sans-serif;color:var(--text)}
.gc-sheet{position:fixed;inset:0;z-index:80;background:rgba(8,11,28,.97);overflow-y:auto;padding:14px 0 calc(20px + env(safe-area-inset-bottom,0px));-webkit-overflow-scrolling:touch}
.gc-sheet[hidden],.gc-big[hidden],.gc-toast[hidden]{display:none}
.gc-head{display:flex;align-items:center;justify-content:space-between;padding:0 18px}
.gc-head h3{margin:0;font-size:19px;color:#ffe2a0}
.gc-x{background:none;border:0;color:var(--text);font-size:22px;width:44px;height:44px}
.gc-nick{display:flex;align-items:center;gap:8px;margin:6px 18px 0;font-size:14px;color:#d9d2bf}
.gc-nick input{flex:1;min-width:0;min-height:40px;border-radius:10px;border:1px solid var(--line);background:rgba(255,255,255,.06);color:var(--text);padding:0 10px;font-size:16px}
.gc-err{margin:2px 18px 0;min-height:16px;font-size:12.5px;color:#ffb0b0}
.gc-track{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none}
.gc-track::-webkit-scrollbar{display:none}
.gc-slide{flex:0 0 100%;scroll-snap-align:center;padding:4px 18px 0;box-sizing:border-box}
.gc-tag{margin:0 0 6px;font-size:13px;color:#d9d2bf;text-align:center}
.gc-img{display:block;width:100%;max-width:420px;aspect-ratio:1080/1350;margin:0 auto;border-radius:14px;background:#141a3a;box-shadow:0 6px 24px rgba(0,0,0,.4)}
.gc-btns{display:flex;gap:10px;max-width:420px;margin:12px auto 0}
.gc-btns .btn{margin:0}
.gc-warn{max-width:420px;margin:8px auto 0;font-size:12.5px;line-height:1.45;color:#d9d2bf;text-align:center}
.gc-dots{display:flex;justify-content:center;gap:8px;margin-top:12px}
.gc-dots i{width:8px;height:8px;border-radius:50%;background:rgba(255,255,255,.25)}
.gc-dots i.on{background:#e8b931}
.gc-big{position:fixed;inset:0;z-index:2;background:rgba(5,8,22,.96);display:flex;flex-direction:column;align-items:center;justify-content:center;padding:16px;gap:10px}
.gc-big img{max-width:100%;max-height:72vh;border-radius:12px;-webkit-touch-callout:default;user-select:auto}
.gc-big-hint{margin:0;color:#ffe2a0;font-size:15px}
.gc-big .btn{max-width:240px}
.gc-toast{position:fixed;left:50%;top:calc(16px + env(safe-area-inset-top,0px));transform:translateX(-50%);z-index:3;background:rgba(250,246,236,.97);color:#1c2142;font-size:13.5px;padding:10px 14px;border-radius:12px;max-width:88%;text-align:center;box-shadow:0 6px 20px rgba(0,0,0,.35)}
.gc-slide[hidden],.gc-dots[hidden]{display:none}
.gc-sheet .btn{display:block;width:100%;min-height:52px;border-radius:14px;border:0;font-size:17px;font-weight:700;margin:10px 0;cursor:pointer;text-align:center;text-decoration:none;line-height:52px}
.gc-sheet .btn.slim{min-height:44px;line-height:1.3;font-size:15px;margin:6px 0;padding:10px}
.gc-sheet .btn.primary{background:linear-gradient(180deg,#f2d27e,#d8a944);color:#2a1d02;box-shadow:0 6px 20px #e8c46a33}
.gc-sheet .btn.primary:disabled{opacity:.45;box-shadow:none}
.gc-sheet .btn.ghost{background:transparent;color:var(--text);border:1px solid var(--line);font-weight:500;line-height:1.3}
.gc-sheet .btn:disabled{opacity:.45}
.gc-sheet{z-index:120}
.cc-sheet{position:fixed;inset:0;z-index:115;background:rgba(5,8,22,.72);display:flex;align-items:flex-end;justify-content:center}
.cc-sheet[hidden]{display:none}
.cc-box{width:100%;max-width:460px;background:#141a3a;border-radius:18px 18px 0 0;padding:18px 18px calc(18px + env(safe-area-inset-bottom,0px));box-sizing:border-box;color:#f3eee2}
.cc-box h3{margin:0 0 4px;font-size:17px;color:#ffe2a0}
.cc-box p{margin:0 0 12px;font-size:13px;color:#a9a6b8;line-height:1.45}
.cc-opt{display:block;width:100%;text-align:left;margin:0 0 10px;padding:13px 14px;border-radius:14px;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.05);color:#f3eee2;font-size:15.5px;font-weight:700}
.cc-opt small{display:block;margin-top:3px;font-weight:400;font-size:12.5px;color:#a9a6b8}
.cc-opt.save{border-color:#e8b93166}
.cc-x{display:block;width:100%;margin-top:4px;padding:12px;border:0;background:none;color:#a9a6b8;font-size:15px}
.rv-card{display:block;width:100%;margin:14px 0 0}
.cc-opt[hidden],.cc-box p[hidden]{display:none}
.ytg-row{margin:16px 0 4px;text-align:center}
.ytg-link{font-size:13px;color:#a9a6b8;text-decoration:underline;text-underline-offset:3px}
.ytg-link[hidden]{display:none}
.ytg-row.ytg-mylamp { margin:4px 0 10px; font-size:13px; }