:root{--bg:#f6f2ea;--surface:#fffdf8;--surface-2:#f1ebe0;--text:#2a2233;--muted:#7b7186;--line:#2a22331a;--accent:#5b3a8c;--accent-hover:#4a2e75;--accent-soft:#ece3f6;--on-accent:#fffdf8;--gold:#b8892a;--gold-soft:#f3e6c6;--danger:#b4413c;--danger-soft:#b4413c14;--card-back:#3a2560;--shadow:0 8px 28px #2a22331a;--r:10px;--r-lg:14px;--font:"Pretendard", "Apple SD Gothic Neo", "Noto Sans KR", system-ui, sans-serif;--font-serif:"RIDIBatang", "Noto Serif KR", "Nanum Myeongjo", Georgia, serif;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}[data-theme=dark]{--bg:#16101e;--surface:#1e1727;--surface-2:#26202f;--text:#ebe4f1;--muted:#a294b1;--line:#ffffff14;--accent:#b492e6;--accent-hover:#c6a9ee;--accent-soft:#b492e629;--on-accent:#1b1425;--gold:#dcae5a;--gold-soft:#dcae5a29;--danger:#e08a86;--danger-soft:#e08a861f;--card-back:#2c1c4a;--shadow:0 8px 28px #00000073;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*{box-sizing:border-box}html,body{height:100%;margin:0}body{background:var(--bg);color:var(--text);font-family:var(--font);-webkit-font-smoothing:antialiased;font-size:14px;line-height:1.6}a{color:var(--accent);text-underline-offset:2px}h1,h2,h3{margin:0;font-weight:600}.muted{color:var(--muted)}.small{font-size:.85em}[hidden]{display:none!important}.app{flex-direction:column;height:100dvh;display:flex}.topbar{background:var(--surface);border-bottom:1px solid var(--line);justify-content:space-between;align-items:center;gap:16px;padding:8px 20px;display:flex}.brand{align-items:center;gap:8px;display:flex}.brand img{border-radius:6px;width:24px;height:24px}.brand h1{font-family:var(--font-serif);letter-spacing:.01em;font-size:15px}.topbar-tools{align-items:center;gap:2px;display:flex}.genre{color:var(--muted);align-items:center;gap:6px;margin-right:6px;font-size:13px;display:flex}.genre select{background:var(--surface-2);border-color:#0000;padding:5px 8px;font-size:13px}.split{flex:1;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);min-height:0;display:grid}.panel{padding:24px 24px 32px;overflow:auto}.table{border-right:1px solid var(--line)}.atelier{background:var(--surface)}.mobile-tabs{border-top:1px solid var(--line);background:var(--surface);padding-bottom:env(safe-area-inset-bottom);display:none}.mobile-tabs button{color:var(--muted);font:inherit;cursor:pointer;background:0 0;border:0;flex:1;padding:12px 8px;font-size:13px}.mobile-tabs button.is-active{color:var(--text);box-shadow:inset 0 2px 0 var(--accent)}@media (width<=800px){.split{grid-template-columns:1fr}.table{border-right:0}.split[data-tab=table] .atelier,.split[data-tab=atelier] .table{display:none}.mobile-tabs{display:flex}.brand h1{display:none}.genre{gap:0;margin-right:2px;font-size:0}.genre select{max-width:34vw;font-size:13px}.topbar{padding:8px 12px}.panel{padding:16px 14px 20px}}.topbar,.topbar-tools,.brand{white-space:nowrap;flex-wrap:nowrap}.btn{font:inherit;border-radius:var(--r);cursor:pointer;border:1px solid var(--line);background:var(--surface);color:var(--text);padding:7px 14px;font-size:13px;transition:background .15s,border-color .15s,color .15s}.btn:hover:not(:disabled){background:var(--surface-2)}.btn:disabled{opacity:.4;cursor:default}.btn.primary{background:var(--accent);border-color:var(--accent);color:var(--on-accent);font-weight:500}.btn.primary:hover:not(:disabled){background:var(--accent-hover);border-color:var(--accent-hover)}.btn.ghost{color:var(--muted);background:0 0;border-color:#0000;padding:7px 10px}.btn.ghost:hover:not(:disabled){background:var(--surface-2);color:var(--text)}.btn.danger{color:var(--danger)}.btn.danger:hover:not(:disabled){background:var(--danger-soft)}.icon-btn{place-items:center;width:32px;height:32px;padding:0;font-size:15px;line-height:1;display:grid}select,input,textarea{font:inherit;color:var(--text);background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:8px 10px;font-size:14px}select{cursor:pointer}select:focus,input:focus,textarea:focus,.btn:focus-visible,.tab:focus-visible,.reader-chip:focus-visible,.chip:focus-visible,.mobile-tabs button:focus-visible,.toast button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}textarea{resize:vertical;width:100%;line-height:1.6}input[type=range]{accent-color:var(--accent);background:0 0;border:0;padding:0}input[type=checkbox],input[type=radio]{accent-color:var(--accent)}.field{flex-direction:column;gap:6px;margin:12px 0;display:flex}.field>span{color:var(--muted);font-size:12px}.actions{flex-wrap:wrap;gap:8px;margin:12px 0;display:flex}.actions.end{justify-content:flex-end}fieldset{border:1px solid var(--line);border-radius:var(--r-lg);margin:16px 0;padding:4px 16px 16px}legend{color:var(--muted);letter-spacing:.04em;padding:0 6px;font-size:12px}.radio-group{color:var(--muted);flex-direction:column;gap:8px;margin:8px 0;font-size:13px;display:flex}.spread-tabs{border-bottom:1px solid var(--line);flex-wrap:wrap;gap:2px;display:flex}.tab{font:inherit;cursor:pointer;color:var(--muted);background:0 0;border:0;border-bottom:2px solid #0000;margin-bottom:-1px;padding:8px 10px;font-size:13px}.tab:hover{color:var(--text)}.tab.is-active{color:var(--text);border-bottom-color:var(--accent)}.spread-tagline{color:var(--muted);margin:16px 0 0;font-size:13px}.choices{flex-wrap:wrap;gap:12px;margin:12px 0 0;display:flex}.choice{color:var(--muted);align-items:center;gap:6px;font-size:13px;display:flex}.choice select{background:var(--surface-2);border-color:#0000;padding:5px 8px;font-size:13px}.table-actions{justify-content:center;gap:8px;margin-top:16px;display:flex}.atelier{flex-direction:column;gap:16px;display:flex;overflow:hidden}.atelier-head{flex-wrap:wrap;flex:none;justify-content:space-between;align-items:center;gap:12px;display:flex}.atelier-head h2{letter-spacing:.04em;color:var(--muted);font-size:14px;font-weight:500}.context{flex:none}.context .field{margin:8px 0 0}.note,.status{font-size:13px}.veil{text-align:center;border:1px dashed var(--line);border-radius:var(--r-lg);flex:auto;place-items:center;min-height:120px;padding:24px;font-size:13px;display:grid}.reader-picker{flex-wrap:wrap;justify-content:flex-end;gap:2px;display:flex}.reader-chip{font:inherit;cursor:pointer;color:var(--muted);background:0 0;border:0;border-radius:999px;align-items:center;gap:7px;padding:3px 10px 3px 3px;font-size:12px;display:flex}.reader-chip:hover{color:var(--text)}.reader-emoji{background:var(--surface-2);width:30px;height:30px;box-shadow:inset 0 0 0 1px var(--line);border-radius:50%;flex:none;place-items:center;font-size:15px;display:grid}.reader-chip.is-active{color:var(--text)}.reader-chip.is-active .reader-emoji{background:var(--accent-soft);box-shadow:0 0 0 2px var(--accent)}@media (width<=800px){.reader-name{display:none}.reader-chip{padding:3px}}.chips-row{flex-wrap:wrap;align-items:center;gap:6px;margin:0;display:flex}.chip{cursor:pointer;background:var(--accent-soft);color:var(--accent);border:0;border-radius:999px;padding:4px 8px 4px 11px;font-size:12px}.chip:after{content:"×";opacity:.55;margin-left:6px}.chip:hover:after{opacity:1}.chips-row .btn{padding:4px 10px;font-size:12px}.picker-item{border-bottom:1px solid var(--line);align-items:baseline;gap:8px;padding:10px 2px;display:flex}.thread{flex-direction:column;flex:auto;gap:22px;min-height:0;padding:2px 0;display:flex;overflow:auto}.msg{gap:10px;display:flex}.msg-assistant{align-self:stretch}.msg-user{align-self:flex-end;max-width:80%}.msg-avatar{background:var(--gold-soft);border-radius:50%;flex:none;place-items:center;width:28px;height:28px;font-size:14px;display:grid}.msg-assistant .msg-body{flex:1;min-width:0}.msg-user .msg-body{background:var(--surface-2);border-radius:var(--r-lg) var(--r-lg) 4px var(--r-lg);padding:9px 13px;font-size:13px}.msg-name{font-family:var(--font-serif);color:var(--gold);letter-spacing:.02em;margin-bottom:4px;font-size:12px}.msg-content{font-family:var(--font-serif);font-size:15px;line-height:1.75}.msg-body p{margin:.55em 0}.msg-body p:first-child{margin-top:0}.msg-body p:last-child{margin-bottom:0}.rd-pos{color:var(--gold);font-family:var(--font);letter-spacing:.04em;margin-top:1.4em;font-size:12px}.rd-q{border-left:2px solid var(--gold-soft);color:var(--muted);margin:.6em 0;padding-left:12px}.rd-h{font-family:var(--font-serif);margin:1.2em 0 .3em;font-size:15px}.rd-list{margin:.5em 0;padding-left:1.1em}.rd-list li{margin:.2em 0}.thread-actions{flex-wrap:wrap;flex:none;gap:8px;display:flex}.composer{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--shadow);flex:none;align-items:flex-end;gap:8px;padding:8px;display:flex}.composer:focus-within{border-color:var(--accent)}.composer-input{resize:none;background:0 0;border:0;flex:1;max-height:8em;padding:6px 4px;font-size:14px;overflow-y:auto}.composer-input:focus{outline:none}.composer-hint{flex:none;align-items:center;gap:8px;margin:0;font-size:12px;display:flex}.composer-hint .btn{padding:4px 10px;font-size:12px}dialog.sheet{border:1px solid var(--line);background:var(--surface);color:var(--text);width:min(560px,100vw - 24px);max-height:calc(100dvh - 32px);box-shadow:var(--shadow);border-radius:16px;padding:0}dialog.sheet::backdrop{background:#140e1c73}.sheet-body{max-height:calc(100dvh - 32px);padding:24px;overflow:auto}.sheet-body h2{margin-bottom:16px;font-size:17px}.journal-item,.character-item{border:1px solid var(--line);border-radius:var(--r-lg);margin:10px 0;padding:14px 16px}.journal-head{flex-wrap:wrap;justify-content:space-between;gap:10px;font-size:13px;display:flex}.journal-cards{color:var(--gold);font-family:var(--font-serif);margin:6px 0 0;font-size:14px}.journal-excerpt{margin:4px 0 0;font-size:12px}.journal-item .actions,.character-item .actions{margin:10px 0 0}.character-item .actions .btn,.journal-item .actions .btn{padding:5px 10px;font-size:12px}.toast-host{z-index:50;flex-direction:column;gap:8px;display:flex;position:fixed;bottom:24px;left:50%;transform:translate(-50%)}.toast{border-radius:var(--r);background:var(--surface);border:1px solid var(--line);box-shadow:var(--shadow);align-items:center;gap:12px;max-width:min(90vw,480px);padding:11px 16px;font-size:13px;display:flex}.toast.error{border-color:color-mix(in srgb, var(--danger) 45%, var(--line));color:var(--danger)}.toast button{font:inherit;background:var(--accent);color:var(--on-accent);cursor:pointer;border:0;border-radius:8px;padding:5px 10px;font-size:12px}.gate{background:var(--bg);place-items:center;min-height:100dvh;padding:24px 16px;display:grid}.gate-card{text-align:center;border:1px solid var(--line);background:var(--surface);width:min(400px,100vw - 32px);box-shadow:var(--shadow);border-radius:16px;padding:32px 28px 24px}.gate-card img{border-radius:14px;width:56px;height:56px}.gate-card h1{font-family:var(--font-serif);margin:14px 0 6px;font-size:19px}.gate-card>.muted{font-size:13px}.gate-form{flex-direction:column;gap:10px;margin:20px 0 8px;display:flex}.gate-input{text-align:center;letter-spacing:.14em;padding:10px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace}.gate-form .btn{padding:10px 14px}.gate-error{color:var(--danger);margin:8px 0 0;font-size:13px}.cards{grid-template-columns:repeat(var(--n,3), minmax(120px, 190px));perspective:1200px;justify-content:center;align-items:start;gap:16px;margin:24px 0 8px;display:grid}.cards[data-count="1"]{--n:1;grid-template-columns:minmax(160px,230px)}.cards[data-count="2"]{--n:2}.cards[data-count="3"]{--n:3}@media (width<=480px){.cards[data-count="3"]{grid-template-columns:repeat(3,minmax(90px,1fr));gap:10px}}.card-slot{text-align:center;perspective:900px;outline:none;margin:0}.card-slot.has-card{cursor:pointer}.card-slot:focus-visible .card{box-shadow:0 0 0 2px var(--accent)}.card{aspect-ratio:7/12;transform-style:preserve-3d;box-shadow:var(--shadow);border-radius:10px;transition:transform .26s cubic-bezier(.2,.8,.2,1),box-shadow .26s;position:relative}.card-slot.is-flipped .card{animation:.6s cubic-bezier(.2,.8,.2,1) card-flip;transform:rotateY(180deg)}.card-slot.has-card:not(.is-flipped):hover .card{transform:translateY(-4px)rotateY(0)}@keyframes card-flip{0%{transform:rotateY(0)translateZ(0)scale(1)}45%{transform:rotateY(90deg)translateZ(38px)scale(1.04)}70%{transform:rotateY(150deg)translateZ(18px)scale(1.02)}to{transform:rotateY(180deg)translateZ(0)scale(1)}}.card-face{backface-visibility:hidden;border-radius:10px;position:absolute;inset:0;overflow:hidden}.card-front{background:var(--surface-2);transform:rotateY(180deg)}.card-front img{object-fit:cover;width:100%;height:100%;transition:transform .4s;display:block}.card-slot.is-reversed .card-front img{transform:rotate(180deg)}.card-slot.is-flipped .card-front:after{content:"";pointer-events:none;background:linear-gradient(105deg,#0000 34%,#ffffff80 50%,#0000 66%);animation:.7s ease-out .3s both card-sheen;position:absolute;inset:0}@keyframes card-sheen{0%{opacity:0;transform:translate(-120%)}25%{opacity:1}to{opacity:0;transform:translate(120%)}}.card-slot.is-dealing{animation:.35s cubic-bezier(.2,.8,.2,1) both deal-in}@keyframes deal-in{0%{opacity:0;transform:translateY(28px)scale(.94)}to{opacity:1;transform:translateY(0)scale(1)}}.card-back{background:radial-gradient(circle at 54% 38%, var(--card-back) 0 9%, transparent 9.5%), radial-gradient(circle at 50% 40%, var(--gold) 0 8%, transparent 8.5%), var(--card-back);box-shadow:inset 0 0 0 5px var(--card-back), inset 0 0 0 6px color-mix(in srgb, var(--gold) 70%, transparent)}.card-slot:not(.has-card) .card-back{opacity:.28;filter:grayscale(.5)}figcaption{flex-direction:column;gap:2px;margin-top:10px;line-height:1.35;display:flex}figcaption .pos{color:var(--muted);font-size:12px}figcaption .name{color:var(--gold);font-family:var(--font-serif);font-size:14px}figcaption .kw{color:var(--muted);font-size:11px}.card-slot.has-card figcaption .name{min-height:1.35em}.card-slot.has-card figcaption .kw{min-height:1.1em}@media (prefers-reduced-motion:reduce){.card{transition:none}.card-slot.is-flipped .card{animation:.4s ease-out card-flip-plain}.card-slot.is-dealing{animation:none}.card-slot.is-flipped .card-front:after{content:none;animation:none}.card-front img{transition:none}}@keyframes card-flip-plain{0%{transform:rotateY(0)}to{transform:rotateY(180deg)}}
