@font-face{font-family:Cheongbong;src:url('assets/fonts/cheongbong-300.woff2') format('woff2');font-weight:300;font-style:normal;font-display:swap}
@font-face{font-family:Cheongbong;src:url('assets/fonts/cheongbong-400.woff2') format('woff2');font-weight:400 600;font-style:normal;font-display:swap}
@font-face{font-family:Cheongbong;src:url('assets/fonts/cheongbong-700.woff2') format('woff2');font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:Chollima;src:url('assets/fonts/chollima-300.woff2') format('woff2');font-weight:300;font-style:normal;font-display:swap}
@font-face{font-family:Chollima;src:url('assets/fonts/chollima-400.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:Chollima;src:url('assets/fonts/chollima-500.woff2') format('woff2');font-weight:500 600;font-style:normal;font-display:swap}
@font-face{font-family:Chollima;src:url('assets/fonts/chollima-700.woff2') format('woff2');font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:Gwangmyeong;src:url('assets/fonts/gwangmyeong-400.woff2') format('woff2');font-weight:100 900;font-style:normal;font-display:swap}
:root{color-scheme:dark;--ink:#0c1d19;--green:#294b3d;--gold:#ddc493;--paper:#f4efdf;--muted:#b9c4b8;--serif:'Noto Serif KR','Batang',serif;--sans:'Noto Sans KR','Malgun Gothic',sans-serif;font-family:var(--sans);font-size:16px;color:var(--paper);background:#081310}
*{box-sizing:border-box}body{margin:0}button,input{font:inherit}button{color:inherit;cursor:pointer}button:disabled{opacity:.35;cursor:default}button:focus-visible,a:focus-visible,input:focus-visible{outline:2px solid #ffe0a3;outline-offset:5px}button{touch-action:manipulation}button,a{-webkit-tap-highlight-color:transparent}[hidden]{display:none!important}a{color:var(--gold)}.game{position:relative;isolation:isolate;width:100%;height:100svh;min-height:590px;overflow:hidden;background:#15271f}.background,.shade{position:absolute;inset:0;z-index:-4}.background{background-position:center;background-size:cover;transition:opacity 1.2s}.library{background-image:url('assets/library-dusk.png')}.courtyard{background-image:url('assets/courtyard-twilight.png');opacity:0}.game[data-bg=courtyard] .courtyard{opacity:1}.shade{z-index:-3;background:linear-gradient(90deg,rgba(6,20,15,.94),rgba(7,23,17,.73) 36%,rgba(7,17,14,.2) 70%),linear-gradient(0deg,rgba(4,14,11,.6),transparent 45%,rgba(4,14,11,.2));transition:background .8s}.topbar{height:82px;padding:0 4%;display:flex;align-items:center;justify-content:space-between;position:relative;z-index:8}.brand{display:flex;gap:12px;align-items:center;font-family:var(--serif);font-size:16px;letter-spacing:.18em;color:#ecdec1}.star{font-size:31px;color:var(--gold)}.top-actions{display:flex;align-items:center;gap:11px}.icon-button{border:1px solid #e0ca9630;background:#10251e45;width:42px;height:42px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;font-size:23px;transition:.2s}.icon-button:hover{background:#b1a07830;border-color:#dfc69a90}#sound{font-size:20px;width:auto;border-radius:24px;padding:0 15px;gap:9px}#sound span{font-size:12px;letter-spacing:.1em}.portrait-wrap{position:absolute;bottom:-12%;right:4%;height:104%;width:56%;pointer-events:none;z-index:-1;display:flex;justify-content:center;filter:drop-shadow(0 8px 30px #07191080);transition:transform .9s ease,opacity .8s}.portrait{height:100%;aspect-ratio:534/1024;background-image:url('assets/karina-sprites.png');background-repeat:no-repeat;background-size:287.64045% 100%;background-position:0 0;transition:filter .35s;animation:appear .7s both}.portrait[data-pose="1"]{aspect-ratio:494/1024;background-size:310.93117% 100%;background-position:51.2476% 0}.portrait[data-pose="2"]{aspect-ratio:508/1024;background-size:302.3622% 100%;background-position:100% 0}.title-screen{position:absolute;left:9%;top:clamp(96px,15vh,180px);width:43%;max-width:610px}.eyebrow{font-size:12px;font-weight:500;letter-spacing:.33em;color:var(--gold);margin:0 0 22px}.title-screen h1{font-family:var(--serif);font-size:clamp(56px,6.5vw,110px);font-weight:500;line-height:1.2;letter-spacing:-.065em;margin:0;text-shadow:0 2px 20px #07181055}.title-screen h1 span{color:#eee5cd;letter-spacing:.01em}.subtitle{max-width:340px;display:flex;align-items:center;gap:17px;font:500 21px var(--serif);letter-spacing:.22em;color:var(--gold);margin:22px 0 25px}.subtitle span{height:1px;flex:1;background:linear-gradient(90deg,transparent,#dbc08b88)}.subtitle span:last-child{transform:rotate(180deg)}.title-quote{font-family:var(--serif);font-size:15px;font-weight:400;color:#d4dacc;margin:0 0 34px;line-height:1.8}.title-menu{display:flex;flex-direction:column;max-width:320px;gap:4px}.title-menu button,.ending-buttons button{height:49px;text-align:left;border:0;background:transparent;padding:0 18px;display:flex;align-items:center;justify-content:space-between;letter-spacing:.05em;font-size:16px;transition:background .2s}.title-menu button:not(:disabled):hover{background:#c7d3a918}.title-menu .primary,.primary{border:1px solid #c8b47b75!important;background:linear-gradient(110deg,#3a5c48aa,#1e3b2cca)!important;color:#f8ecd0}.primary:hover{background:#49684ec4!important}.menu-detail{font-size:11px;letter-spacing:.13em;opacity:.5}.button-star{font-size:24px;color:var(--gold)}.about-link{margin-top:22px;background:transparent;border:0;border-bottom:1px solid #c6b58940;padding:0 0 6px;color:#b7c2b2;font-size:12px;letter-spacing:.04em}.title-footer{position:absolute;bottom:27px;left:4%;right:4%;display:flex;justify-content:space-between;font-size:12px;color:#e1e3cf88;letter-spacing:.09em}.dust{position:absolute;inset:0;overflow:hidden;z-index:-2;pointer-events:none}.dust i{position:absolute;left:17%;top:27%;width:3px;height:3px;border-radius:50%;background:#f4dda6;box-shadow:0 0 9px #ffef9d;opacity:.5;animation:float 7s infinite alternate ease-in-out}.dust i:nth-child(2){left:63%;top:22%;animation-delay:-3s}.dust i:nth-child(3){left:43%;top:62%;animation-delay:-1s}.dust i:nth-child(4){left:84%;top:42%;animation-delay:-6s}.dust i:nth-child(5){left:7%;top:75%;animation-delay:-2s}.dust i:nth-child(6){left:54%;top:85%;animation-delay:-4s}.dust i:nth-child(7){left:31%;top:46%;animation-delay:-3s}.dust i:nth-child(8){left:75%;top:12%;animation-delay:-2s}
.game[data-view=play] .shade{background:linear-gradient(0deg,#04110c99,transparent 48%,#04110c88)}.game[data-view=play] .portrait-wrap{right:8%;bottom:-19%;height:110%;width:60%}.game[data-view=play] .title-footer{display:none}.chapter-info{position:absolute;top:108px;left:5%;display:flex;flex-direction:column;gap:10px;text-shadow:0 2px 8px #081810}.chapter-info>span:first-child{font-size:11px;letter-spacing:.25em;color:var(--gold)}#chapter-title{font:500 24px var(--serif)}.chapter-info small{font-size:13px;letter-spacing:.04em;opacity:.7}.dialogue-shell{position:absolute;left:7%;right:7%;bottom:4%;border:1px solid #cdb17a99;background:linear-gradient(115deg,#10271ff5,#0d1e19ed);box-shadow:0 8px 50px #00120866, inset 0 0 0 5px #7c98651a;backdrop-filter:blur(16px);padding:0 34px 0}.dialogue-shell:before,.dialogue-shell:after{content:'';position:absolute;height:6px;width:6px;background:var(--gold);transform:rotate(45deg);top:-3px}.dialogue-shell:before{left:-3px}.dialogue-shell:after{right:-3px}.dialogue-top{display:flex;align-items:center;gap:20px;padding-top:20px;height:45px}.speaker{font:600 19px var(--serif);color:var(--gold);min-width:62px}.dialogue-ornament{opacity:.35;font-size:20px}.chapter-progress{margin-left:auto;color:#b5c5ae90;font-size:11px;letter-spacing:.18em}.dialogue{display:block;width:100%;min-height:118px;background:transparent;text-align:left;border:0;padding:18px 10px 26px 0;position:relative;font:400 21px/1.9 var(--serif);word-break:keep-all;overflow-wrap:anywhere}.next-cue{position:absolute;right:0;bottom:8px;font:11px var(--sans);letter-spacing:.12em;color:#b7c49d;display:flex;gap:12px;align-items:center}.next-cue span{font-size:16px;animation:cue 1s infinite alternate}.quick-menu{display:flex;align-items:center;gap:23px;min-height:50px;border-top:1px solid #b8c09420}.quick-menu button{font-size:12px;background:transparent;border:0;padding:13px 0;color:#c9d0bf}.quick-menu button:hover{color:var(--gold)}.quick-menu #auto[aria-pressed=true]{color:#ead19d}.quick-menu #auto span{font-size:10px;margin-left:5px;opacity:.6}.keyboard-hint{font-size:10px;letter-spacing:.12em;margin-left:auto;color:#bbc5ae55}.choices{position:absolute;top:35%;left:10%;width:min(510px,48%);display:flex;flex-direction:column;gap:12px;z-index:4;animation:appear .35s}.choices button{background:linear-gradient(90deg,#122e26fa,#153629ed);border:1px solid #cdb78388;padding:17px 22px;min-height:60px;box-shadow:0 5px 24px #04130d50;display:flex;align-items:center;gap:18px;text-align:left;font:400 16px/1.7 var(--serif);transition:transform .15s,background .15s;word-break:keep-all}.choices button:hover{transform:translateX(5px);background:#3a5944f5}.choice-number{font:12px var(--sans);color:var(--gold);opacity:.75}.game[data-view=ending] .shade{background:#081c17d9}.game[data-view=ending] .portrait-wrap{opacity:.12;right:-8%}.game[data-view=ending] .title-footer{display:none}.ending-screen{position:absolute;top:50%;left:50%;transform:translate(-50%,-48%);width:90%;max-width:600px;text-align:center}.ending-screen .eyebrow{margin-bottom:12px}.ending-star{font-size:66px;color:var(--gold)}.ending-screen h2{font:500 clamp(28px,4vw,48px)/1.5 var(--serif);margin:12px 0}.ending-screen p{font-family:var(--serif);color:#d2dbc9;font-size:16px;line-height:1.9}.ending-rule{width:50px;height:1px;background:var(--gold);margin:25px auto}.ending-buttons{display:flex;flex-direction:column;margin:32px auto 24px;width:280px;gap:8px}.ending-buttons button{justify-content:center}.ending-screen small{font-size:12px;opacity:.5}
dialog{width:min(650px,90vw);max-height:85svh;border:1px solid #bca46e80;background:#10241f;color:var(--paper);box-shadow:0 25px 100px #0009;padding:28px 30px;overflow:auto}dialog::backdrop{background:#03130cc9;backdrop-filter:blur(9px)}.modal-heading{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:25px}.modal-heading h2{font:500 23px var(--serif);margin:0}.modal-heading .icon-button{font-size:28px;width:36px;height:36px}.modal-copy{color:#c6d1bf;line-height:1.95;font-size:14px;word-break:keep-all}.modal-copy strong{color:var(--gold);font-weight:500}.modal-copy p{margin:0 0 16px}.small-note{font-size:12px;line-height:1.8;color:#a5b69f}.setting-row{display:flex;align-items:center;justify-content:space-between;gap:22px;padding:20px 0;border-bottom:1px solid #c7bc8d20;font-size:15px}.setting-row label{display:flex;flex-direction:column;gap:7px}.setting-row small{color:#a9b69f;font-size:12px}.setting-row input[type=range]{accent-color:#c6b47a;width:160px}.setting-row input[type=checkbox]{width:20px;height:20px;accent-color:#8baa74}.log-entry{padding:13px 0;border-bottom:1px solid #c7bc8d18}.log-entry strong{font-size:13px;color:var(--gold);font-weight:500}.log-entry p{margin:7px 0;font:15px/1.8 var(--serif);color:#dbe0d1}.slot{display:flex;align-items:center;gap:18px;padding:19px 16px;margin-bottom:12px;width:100%;text-align:left;border:1px solid #bba27560;background:#1b3329}.slot:hover{background:#284536}.slot-num{font-size:22px;color:var(--gold);font-family:var(--serif)}.slot-info{display:flex;flex-direction:column;gap:7px}.slot-info strong{font-size:15px;font-weight:500}.slot-info small{font-size:12px;color:#aaba9f}.ending-card{border:1px solid #c0a77255;padding:20px;margin:12px 0;display:flex;gap:19px;align-items:center}.ending-card .number{font-size:24px;color:var(--gold);font-family:var(--serif)}.ending-card h3{font:500 18px var(--serif);margin:0 0 8px}.ending-card p{font-size:13px;line-height:1.7;color:#aabdac;margin:0}.ending-card.locked{opacity:.5}.confirm-actions{display:flex;gap:12px;margin-top:25px}.confirm-actions button{padding:12px 25px;border:1px solid #ccb88860;background:#294335}.toast{position:fixed;bottom:30px;left:50%;transform:translate(-50%,20px);background:#f2e8ce;color:#1d3529;padding:13px 24px;box-shadow:0 3px 30px #0005;z-index:99;font-size:14px;opacity:0;pointer-events:none;transition:.25s;max-width:90vw;word-break:keep-all;text-align:center}.toast.visible{opacity:1;transform:translate(-50%,0)}.noscript{position:fixed;bottom:0;padding:24px;background:#142c26}.game[data-reduced=true] *{animation:none!important;transition:none!important}@keyframes float{to{transform:translate(16px,-60px);opacity:.1}}@keyframes cue{to{opacity:.35;transform:translateY(3px)}}@keyframes appear{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
@media(min-width:1500px){.title-screen{top:17vh}.title-menu button{height:56px}.title-quote{margin-bottom:40px}.dialogue-shell{left:12%;right:12%;bottom:6%}.dialogue{min-height:150px;font-size:24px}.quick-menu{min-height:56px}.quick-menu button{font-size:14px}}
@media(max-height:750px) and (min-width:701px){.title-screen{top:90px}.title-screen h1{font-size:65px}.eyebrow{margin-bottom:12px}.subtitle{margin:13px 0 15px}.title-quote{margin-bottom:20px}.title-menu button{height:43px}.about-link{margin-top:13px}.portrait-wrap{height:110%;bottom:-15%}.dialogue-shell{bottom:3%}.dialogue{min-height:100px}.choices{top:29%;gap:8px}.choices button{padding:12px 18px;min-height:52px}.chapter-info{top:85px}}
@media(max-width:700px){.game{min-height:680px}.topbar{height:66px;padding:0 6%}.brand{font-size:13px;letter-spacing:.1em;gap:7px}.star{font-size:25px}.top-actions{gap:7px}.icon-button{width:35px;height:35px;font-size:20px}#sound{padding:0 10px;font-size:17px}#sound span{font-size:10px}#fullscreen{display:none}.title-screen{left:8%;top:13%;width:84%}.title-screen .eyebrow{font-size:10px;letter-spacing:.22em;margin-bottom:14px}.title-screen h1{font-size:clamp(48px,12.5vw,74px)}.subtitle{font-size:17px;max-width:220px;gap:12px;margin:20px 0}.title-quote{font-size:13px;max-width:180px;line-height:1.9;margin-bottom:0}.title-menu{margin-top:clamp(145px,22vh,210px);max-width:100%;background:#10251d88;backdrop-filter:blur(14px);border:1px solid #dfcda333;padding:7px}.title-menu button{height:46px;font-size:15px}.title-menu .primary{background:#315440a8!important}.about-link{font-size:12px;margin-top:14px}.portrait-wrap{height:77%;bottom:6%;width:76%;right:-18%;filter:drop-shadow(0 8px 20px #06170f55)}.shade{background:linear-gradient(90deg,#071e15df,#0a211662 64%,#0a21162a),linear-gradient(0deg,#081d16bb,transparent 70%)}.title-footer{left:8%;bottom:18px;font-size:10px}.title-footer span:last-child{display:none}.game[data-view=play] .portrait-wrap{height:88%;bottom:5%;right:-17%;width:120%}.chapter-info{top:83px;left:7%;gap:8px}.chapter-info>span:first-child{font-size:10px}#chapter-title{font-size:20px}.chapter-info small{font-size:12px}.dialogue-shell{left:4%;right:4%;bottom:3%;padding:0 20px}.dialogue-top{padding-top:15px;height:39px}.speaker{font-size:17px}.dialogue{font-size:17px;line-height:1.85;min-height:150px;padding:15px 0 29px}.quick-menu{gap:0;justify-content:space-between;min-height:47px}.quick-menu button{font-size:11px;min-height:44px}.keyboard-hint{display:none}.choices{top:auto;bottom:calc(3% + 246px);left:7%;width:86%;gap:8px}.choices button{min-height:54px;font-size:14px;line-height:1.6;padding:12px 15px;gap:12px;background:#102d24f2}.next-cue{font-size:10px}.ending-screen{transform:translate(-50%,-45%)}.ending-star{font-size:48px}.ending-screen p{font-size:14px}.ending-rule{margin:20px auto}.ending-buttons{margin-top:25px}.ending-screen h2{font-size:29px}dialog{padding:23px 20px;width:92vw}.modal-heading h2{font-size:20px}.setting-row{font-size:14px}.setting-row input[type=range]{width:115px}.toast{font-size:12px;width:max-content}}
@media(max-width:700px) and (min-height:850px){.title-menu{margin-top:25vh}.portrait-wrap{height:75%;bottom:8%}}
@media(max-height:520px) and (orientation:landscape){.game{min-height:420px}.topbar{height:50px}.title-screen{top:60px}.title-screen h1{font-size:38px}.title-screen .eyebrow{font-size:10px;margin-bottom:6px}.subtitle{font-size:14px;margin:8px 0}.title-quote{font-size:12px;margin:8px 0}.title-menu{max-width:260px}.title-menu button{height:35px;font-size:13px}.about-link{margin-top:8px}.title-footer{bottom:10px}.portrait-wrap{height:105%}.chapter-info{top:62px}#chapter-title{font-size:18px}.chapter-info small{display:none}.dialogue-shell{bottom:3%;left:5%;right:5%;padding:0 22px}.dialogue-top{height:31px;padding-top:10px}.speaker{font-size:15px}.dialogue{min-height:80px;font-size:16px;padding:12px 0 25px}.quick-menu{min-height:35px}.quick-menu button{padding:8px 0}.choices{top:75px;left:8%;width:58%;gap:6px}.choices button{min-height:40px;padding:8px 13px;font-size:13px}.ending-screen{top:53%}.ending-star{display:none}.ending-screen h2{font-size:25px;margin:3px 0}.ending-screen p{font-size:13px;margin:7px 0}.ending-rule{margin:10px auto}.ending-buttons{margin:14px auto 8px;gap:4px}.ending-buttons button{height:36px;font-size:13px}.ending-screen small{font-size:11px}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media(max-height:520px) and (orientation:landscape){.title-menu{margin-top:8px;padding:0;background:transparent;backdrop-filter:none;border:0}.title-screen{width:48%;left:8%;top:60px}.title-quote{max-width:none}.title-footer{bottom:8px}.game[data-view=play] .portrait-wrap{right:1%;bottom:-20%;height:110%;width:60%}.choices{bottom:auto}.topbar{padding:0 4%}}
@media(min-width:701px){.game{max-width:1920px;margin:0 auto}.title-screen{width:44%}.title-quote{white-space:nowrap}.portrait-wrap{right:2%;width:52%}.game[data-view=play] .portrait-wrap{right:4%;width:55%}}
.game{overflow:clip}
:root{--serif:'Cheongbong','Gwangmyeong','Batang','Segoe UI Symbol',serif;--sans:'Chollima','Gwangmyeong','Malgun Gothic','Segoe UI Symbol',sans-serif}
.title-menu{margin-top:35px}.title-screen h1{font-weight:700}.subtitle{margin-bottom:30px}.icon-button,.star,.button-star,.ending-star,.dialogue-ornament{font-family:'Segoe UI Symbol',sans-serif}
@media(max-width:700px) and (orientation:portrait){.title-menu{margin-top:clamp(155px,24vh,260px)}}
@media(max-height:520px) and (orientation:landscape){.title-menu{margin-top:14px}.subtitle{margin-bottom:12px}}
.game{--speaker-accent:#f0c878;--speaker-panel:#2b2619}
.game[data-speaker=malfoy]{--speaker-accent:#a8e0c0;--speaker-panel:#112e24}
.game[data-speaker=ron]{--speaker-accent:#f2ae8f;--speaker-panel:#342018}
.game[data-view=play] .dialogue-shell{border-color:var(--speaker-accent);border-top-width:3px;background:linear-gradient(115deg,var(--speaker-panel),#101b19f5);transition:background .2s,border-color .2s}
.dialogue-shell:before,.dialogue-shell:after{background:var(--speaker-accent)}
.dialogue-top{height:auto;min-height:62px;padding-top:14px;gap:14px}
.speaker{display:inline-flex;align-items:center;justify-content:center;min-width:104px;padding:8px 22px;background:var(--speaker-accent);border-radius:3px;color:#15221c;font:700 24px/1.2 var(--sans);white-space:nowrap;box-shadow:0 2px 12px #0003}
.speaker-kind{color:var(--speaker-accent);font:400 13px var(--sans);white-space:nowrap}
.game[data-view=play]:not([data-speaker=malfoy]) .portrait{filter:brightness(.58) saturate(.65)}
.game[data-view=play][data-speaker=malfoy] .portrait{filter:brightness(1.04) drop-shadow(0 0 16px #a8e0c038)}
.game[data-line-kind=thought] #line-text{color:#ddd8c9}
.log-entry[data-speaker=harry] strong{color:#f0c878}.log-entry[data-speaker=malfoy] strong{color:#a8e0c0}.log-entry[data-speaker=ron] strong{color:#f2ae8f}
.speaker[data-turn=a]{animation:speakerInA .22s ease-out}.speaker[data-turn=b]{animation:speakerInB .22s ease-out}
@keyframes speakerInA{from{opacity:.4;transform:translateY(5px)}to{opacity:1;transform:none}}
@keyframes speakerInB{from{opacity:.4;transform:translateY(5px)}to{opacity:1;transform:none}}
@media(max-width:700px){.dialogue-top{min-height:58px;padding-top:12px;gap:12px}.speaker{font-size:21px;min-width:90px;padding:7px 17px}.speaker-kind{font-size:12px}.choices{bottom:calc(3% + 278px)}}
@media(max-height:520px) and (orientation:landscape){.dialogue-top{min-height:43px;padding-top:8px}.speaker{font-size:18px;min-width:88px;padding:5px 16px}.choices{bottom:auto}}
.setting-row select{font:14px var(--sans);color:var(--paper);background:#1b3329;border:1px solid #bca46e80;padding:9px 12px;max-width:240px;min-width:120px}.setting-row label{min-width:0}.setting-row .small-note{margin:0;max-width:280px}.voice-preview{padding:10px 18px;border:1px solid #bca46e80;background:#294335;margin-top:20px}.voice-status{color:var(--speaker-accent);font:11px var(--sans)}.controls-note{white-space:pre-line}.dialogue:disabled{opacity:1;color:inherit}.log-entry[data-speaker=myChoice] strong{color:#bdcfe5}
html[lang=en] .title-screen h1{font-size:clamp(42px,5.2vw,82px);letter-spacing:-.04em}html[lang=ja] .title-screen h1{font-size:clamp(42px,5.6vw,90px)}
@media(max-width:700px){.setting-row select{max-width:46%;min-width:100px}.setting-row{gap:12px}.voice-status{display:none}.dialogue{min-height:150px}.speaker{font-size:20px}.choices button{font-size:14px}html[lang=en] .title-screen h1{font-size:clamp(35px,9vw,58px)}html[lang=ja] .title-screen h1{font-size:clamp(39px,10vw,65px)}}
.story-controls{position:absolute;left:7%;right:7%;bottom:4%;display:flex;flex-direction:column;gap:18px;pointer-events:none}.story-controls>*{pointer-events:auto}.story-controls .dialogue-shell{position:relative;inset:auto}.story-controls .choices{position:relative;inset:auto;width:min(510px,52%);margin-left:3.5%}
@media(min-width:1500px){.story-controls{left:12%;right:12%;bottom:6%}}
@media(max-width:700px){.story-controls{left:4%;right:4%;bottom:3%;gap:14px}.story-controls .choices{width:94%;margin-left:3%}.brand{letter-spacing:0;font-size:12px}.brand span:last-child{max-width:160px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}}
@media(max-height:520px) and (orientation:landscape){.story-controls{left:5%;right:5%;bottom:3%;gap:10px}.story-controls .choices{width:64%;margin-left:3%}.story-controls .choices button{padding:7px 12px;min-height:36px;font-size:13px}.dialogue{min-height:70px}}
/* Additional expressions use individual transparent illustrations. */
.portrait[data-pose=angry],.portrait[data-pose=worried],.portrait[data-pose=hurt],.portrait[data-pose=determined],.portrait[data-pose=relieved],.portrait[data-pose=laughing]{aspect-ratio:2/3;background-size:contain;background-position:center bottom}
.portrait[data-pose=angry]{background-image:url('assets/emotions/angry.png')}.portrait[data-pose=worried]{background-image:url('assets/emotions/worried.png')}.portrait[data-pose=hurt]{background-image:url('assets/emotions/hurt.png')}.portrait[data-pose=determined]{background-image:url('assets/emotions/determined.png')}.portrait[data-pose=relieved]{background-image:url('assets/emotions/relieved.png')}.portrait[data-pose=laughing]{background-image:url('assets/emotions/laughing.png')}
.portrait[data-pose=furious],.portrait[data-pose=jealous]{aspect-ratio:2/3;background-size:contain;background-position:center bottom}
.portrait[data-pose=furious]{background-image:url('assets/emotions/furious.png')}.portrait[data-pose=jealous]{background-image:url('assets/emotions/jealous.png')}
.game[data-emotion=furious][data-speaker=malfoy]{--speaker-accent:#f3b1a4;--speaker-panel:#35211f}
.game[data-emotion=furious][data-speaker=malfoy] .speaker{box-shadow:0 0 18px #bd594328}
.game[data-portrait=false] .portrait-wrap{opacity:0}
.background.cg-wand-return{background-image:url('assets/cg/wand-return.png');background-color:#07130f;background-size:cover;opacity:0}.game[data-cg="wand-return"] .cg-wand-return{opacity:1}
.spell-fx{position:absolute;inset:0;z-index:3;pointer-events:none;overflow:hidden}.spell-shape,.spell-spark{position:absolute;display:block;left:58%;top:42%;will-change:transform,opacity}.spell-shield{width:min(34vw,430px);aspect-ratio:1;border:3px solid #bfe9d1;border-radius:50%;background:radial-gradient(circle,#dfffea16 0 45%,#9ee4c33d 58%,transparent 62%);box-shadow:0 0 32px #8edabf55,inset 0 0 24px #d8ffec44}.spell-beam{left:34%;top:39%;width:min(47vw,650px);height:5px;transform-origin:left;background:linear-gradient(90deg,transparent,#d7f4dd 18%,#91d8b4 72%,transparent);box-shadow:0 0 16px #b9efd0}.spell-lift{left:62%;top:42%;width:120px;height:150px;border:1px solid #d8efc488;border-width:0 2px;border-radius:50%;background:linear-gradient(0deg,transparent,#d8efc43b,transparent)}.spell-reveal{width:min(28vw,330px);aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,#fff6c5aa 0,#d8e8af44 28%,transparent 68%);box-shadow:0 0 42px #fff2a955}.spell-spark{left:58%;top:42%;width:10px;height:10px;border-radius:50%;background:#fff4c4;box-shadow:0 0 20px 8px #d8efb888}.spell-static{position:absolute;left:50%;top:28%;transform:translateX(-50%);padding:7px 15px;border:1px solid #d8c58b88;border-radius:999px;background:#10251ed9;color:#f1dbab;font:600 12px var(--serif);letter-spacing:.12em;box-shadow:0 4px 20px #0005}.choice-prompt{margin:0 0 2px;padding:0 4px;color:#e5d4aa;font:600 12px var(--sans);letter-spacing:.1em}.spell-choices button{border-left:3px solid #b9ddb9}.spell-choice .spell-name{flex:0 0 116px;color:#e8cf94;font:600 12px var(--sans);letter-spacing:.03em}.spell-choice .choice-text{flex:1}.spell-choice[data-spell=protego],.spell-choice[data-spell=reparo]{background:linear-gradient(90deg,#163b35fa,#153629ed)}.spell-choice[data-spell=lumos],.spell-choice[data-spell=revelio]{background:linear-gradient(90deg,#3c3825f2,#153629ed)}.spell-choice[data-spell=accio],.spell-choice[data-spell=arresto]{background:linear-gradient(90deg,#293b31fa,#153629ed)}
@media(max-width:700px){.background.cg-wand-return{background-size:contain;background-repeat:no-repeat}.spell-shape,.spell-spark{left:54%;top:35%}.spell-beam{left:18%;width:70vw}.spell-choice .spell-name{flex-basis:94px;font-size:11px}.spell-static{top:20%}}
.background.classroom{background-image:url('assets/classroom-day.png');opacity:0}.background.tower{background-image:url('assets/tower-rain.png');opacity:0}.game[data-bg=classroom] .classroom,.game[data-bg=tower] .tower{opacity:1}
.game[data-speaker=hermione]{--speaker-accent:#d3b9f3;--speaker-panel:#292035}.game[data-speaker=neville]{--speaker-accent:#d7d4a1;--speaker-panel:#2a2e20}.game[data-speaker=mira]{--speaker-accent:#abd4ee;--speaker-panel:#172d39}.game[data-speaker=vale]{--speaker-accent:#c1c2cd;--speaker-panel:#242530}.game[data-speaker=mcgonagall],.game[data-speaker=pince]{--speaker-accent:#ddd0b6;--speaker-panel:#2b2925}
.affection-card{position:absolute;top:112px;right:5%;width:220px;padding:13px 17px;border:1px solid #e8d1ad50;border-radius:6px;background:#10251ee8;font:12px var(--sans);color:#ded8c9;backdrop-filter:blur(10px)}.affection-card>div{display:flex;justify-content:space-between;gap:10px}.affection-card strong{color:#f3d1a4;font-weight:500}.affection-card meter{display:block;width:100%;height:7px;margin:10px 0 7px;appearance:none;border:0;background:#ffffff19;border-radius:5px;overflow:hidden}.affection-card meter::-webkit-meter-bar{background:#ffffff19;border:0;height:7px}.affection-card meter::-webkit-meter-optimum-value{background:linear-gradient(90deg,#a9c3a0,#efd0a1);transition:width .5s}.affection-card meter::-moz-meter-bar{background:#d4bd91}#relationship-label{font-size:11px;color:#b4bcb2}#affection-delta{float:right;color:#c4e7ad;font-size:11px}#affection-delta[data-direction=down]{color:#edb6ad}.game:not([data-view=play]) .affection-card{display:none}.voice-replay{font:18px var(--sans);border:1px solid #afc5b266;border-radius:50%;width:33px;height:33px;background:#142e23;color:var(--speaker-accent)}
@media(max-width:700px){.affection-card{top:76px;right:5%;width:128px;padding:9px 10px;font-size:10px}.affection-card>div{flex-wrap:wrap;gap:3px}.affection-card meter{margin:6px 0}.affection-card strong{font-size:11px}#relationship-label{font-size:9px}#affection-delta{display:block;float:none;margin-top:3px}.chapter-info{max-width:calc(88% - 132px)}#chapter-title{line-height:1.3}.title-menu button{height:42px}.title-menu{margin-top:clamp(120px,20vh,200px)}}
@media(max-height:520px) and (orientation:landscape){.affection-card{top:61px;width:170px;right:5%;padding:7px 10px}.affection-card meter{margin:5px 0}.affection-card>div{flex-wrap:nowrap}.title-menu{margin-top:8px}.title-menu button{height:31px}}

/* Malfoy faces right, so keep her on the left looking into the scene. */
.portrait-wrap{left:2%;right:auto}
.title-screen{left:auto;right:9%;text-align:right}
.title-screen .subtitle,.title-screen .title-quote,.title-screen .title-menu{margin-left:auto}
.game:not([data-view=play]) .shade{background:linear-gradient(270deg,rgba(6,20,15,.94),rgba(7,23,17,.73) 36%,rgba(7,17,14,.2) 70%),linear-gradient(0deg,rgba(4,14,11,.6),transparent 45%,rgba(4,14,11,.2))}
.game[data-view=play] .portrait-wrap{left:4%;right:auto}
.game[data-view=ending] .portrait-wrap{left:-8%;right:auto}
.story-controls .choices{margin-left:auto;margin-right:3.5%}
@media(max-width:700px){.title-screen{left:auto;right:8%}.portrait-wrap{left:-18%;right:auto}.game:not([data-view=play]) .shade{background:linear-gradient(270deg,#071e15df,#0a211662 64%,#0a21162a),linear-gradient(0deg,#081d16bb,transparent 70%)}.game[data-view=play] .portrait-wrap{left:-17%;right:auto}.story-controls .choices{margin-left:auto;margin-right:3%}}
@media(max-height:520px) and (orientation:landscape){.title-screen{left:auto;right:8%}.game[data-view=play] .portrait-wrap{left:1%;right:auto}.story-controls .choices{margin-left:auto;margin-right:3%}}

@media(max-width:700px) and (orientation:portrait){.chapter-info{padding:9px 11px;border-left:2px solid #d5bb8280;border-radius:0 4px 4px 0;background:#10251edb;gap:7px}.chapter-info small{opacity:.9}}