@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@400;500;600;700;800&family=Space+Grotesk:wght@400;500;600;700&display=swap');
:root{color-scheme:dark;--bg:#101613;--panel:#19201b;--line:#30392e;--gold:#d8b778;--text:#e8e9df;--muted:#909b8e}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font:14px 'Noto Sans KR',sans-serif}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer;color:inherit;border:1px solid var(--line);background:#20281f;border-radius:5px;padding:9px 12px;transition:background .15s,transform .15s}button:hover:not(:disabled){background:#354030}button:active:not(:disabled){transform:translateY(1px)}button:focus-visible,a:focus-visible{outline:2px solid var(--gold);outline-offset:3px}button:disabled{opacity:.4;cursor:not-allowed}header{height:90px;border-bottom:1px solid var(--line);padding:0 4%;display:flex;align-items:center;justify-content:space-between;gap:20px}.brand{display:flex;gap:12px;align-items:center;text-decoration:none;color:var(--text);font:700 20px 'Space Grotesk',sans-serif;letter-spacing:2px}.crest{font-size:40px;color:var(--gold)}.brand small{display:block;font:12px 'Noto Sans KR';letter-spacing:4px;color:var(--muted);margin-top:5px}.chapter{font:12px 'Space Grotesk';letter-spacing:2px;color:var(--muted)}.chapter span{display:block;font:13px 'Noto Sans KR';letter-spacing:0;margin-top:8px;color:#b9c2b3}.head-actions{display:flex;gap:8px}main{max-width:1600px;margin:auto;padding:32px 4% 0}.topline{display:flex;justify-content:space-between;align-items:center;margin-bottom:26px}.eyebrow{font:11px 'Space Grotesk',sans-serif;letter-spacing:2px;color:var(--gold)}h1{font-size:27px;font-weight:600;letter-spacing:-1px;margin:8px 0 0}.record{color:var(--muted);font-size:12px;text-align:right}.record strong{color:var(--gold);font:600 20px 'Space Grotesk';margin-left:12px}.record small{display:block;margin-top:6px}.layout{display:grid;grid-template-columns:minmax(0,1fr) 310px;gap:24px}.battle-panel{min-width:0}.battle-head{height:53px;display:flex;justify-content:space-between;align-items:center;border:1px solid var(--line);border-bottom:0;padding:0 16px;background:var(--panel);border-radius:7px 7px 0 0}.battle-head>div{display:flex;align-items:center;gap:12px}.battle-head b{font-size:13px}.battle-head #stage{font:12px 'Space Grotesk';color:var(--muted);border-left:1px solid var(--line);padding-left:12px}.battle-head button{font-size:12px;padding:5px 9px;background:transparent}.battle-head button.active{color:var(--gold);border-color:#756446}.live-dot{width:6px;height:6px;background:var(--gold);border-radius:50%}.arena{position:relative;overflow:hidden;background:#182529;border:1px solid var(--line);aspect-ratio:1200/660}canvas{display:block;width:100%;height:100%;touch-action:none;cursor:crosshair}.arena-hud{position:absolute;inset:20px 22px auto;display:flex;justify-content:space-between;pointer-events:none}.castle-health{width:210px}.castle-health>span{font-size:12px;display:flex;justify-content:space-between;text-shadow:0 2px 3px #000}.castle-health b{font:12px 'Space Grotesk'}.meter{height:6px;background:#151d20;margin-top:9px;border:1px solid #596655}.meter i{display:block;background:#b4c08b;height:100%;width:100%;transition:width .2s}.wave-info{text-align:right;text-shadow:0 2px 3px #000}.wave-info span{font-size:13px}.wave-info small{display:block;font-size:11px;color:#b8c3b6;margin-top:5px}.center-message{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;background:linear-gradient(90deg,#0a171752,#0b171c70);text-align:center;padding:18px}.center-message h2{font-size:28px;margin:12px 0}.center-message p{color:#c2cbbf;margin:0 0 25px;font-size:14px}.primary{color:#1b2017;background:var(--gold);border-color:var(--gold);font-weight:700;padding:14px 24px;min-width:220px}.primary:hover:not(:disabled){background:#ebcc8e}.primary span{margin-left:24px}.center-message small{font-size:11px;color:#afb8a6;margin-top:14px}.arena-bottom{position:absolute;bottom:15px;left:22px;right:22px;display:flex;justify-content:space-between;color:#b9c4b1;font-size:11px;pointer-events:none}.arena-bottom i,footer i{color:#687360;margin:0 10px}.skillbar{padding:17px 16px;display:flex;gap:10px;background:var(--panel);border:1px solid var(--line);border-top:0;border-radius:0 0 7px 7px}.skill-intro{min-width:145px;display:flex;flex-direction:column;justify-content:center;gap:7px}.skill-intro strong{font-size:12px;font-weight:500}.skill{display:flex;align-items:center;flex:1;gap:9px;padding:10px 9px;position:relative;text-align:left;background:#222921}.skill b{font-size:12px}.skill small{display:block;font-size:11px;color:var(--muted);margin-top:4px}.skill kbd{position:absolute;right:5px;top:3px;font:10px 'Space Grotesk';color:var(--muted)}.skill-symbol{font-size:27px}.fire{color:#e6a179}.ice{color:#a0caca}.heal{color:#b4c58b}.below{display:flex;justify-content:space-between;gap:10px;font-size:11px;color:var(--muted);padding:13px 0}aside{background:var(--panel);border:1px solid var(--line);border-radius:7px;padding:20px}.wallet{display:flex;justify-content:space-between;align-items:center;padding-bottom:18px;border-bottom:1px solid var(--line)}.wallet h2{margin:5px 0 0;font:600 31px 'Space Grotesk';color:var(--gold)}.wallet h2 span{font-size:26px}.wallet h2 small{font-size:13px;margin-left:8px;color:var(--muted)}.wallet>span{font-size:11px;color:var(--muted)}.shop-head{display:flex;justify-content:space-between;align-items:center;margin:19px 0 13px}.shop-head h2{font-size:16px;margin:0}.shop-head>span{font-size:11px;color:#a5b68c}.tabs{display:flex;gap:3px;border-bottom:1px solid var(--line);margin-bottom:8px}.tabs button{flex:1;border:0;border-radius:0;background:transparent;padding:9px;font-size:13px;color:var(--muted)}.tabs .selected{color:var(--gold);border-bottom:2px solid var(--gold)}.item{display:grid;grid-template-columns:35px 1fr auto;align-items:center;gap:8px;border-bottom:1px solid #2b3429;padding:15px 0}.item-icon{font-size:24px;color:#b5be9e}.item b{font-size:13px;font-weight:500}.item small{display:block;color:var(--muted);font-size:11px;margin-top:5px}.item em{font:10px 'Space Grotesk';color:var(--gold);font-style:normal;margin-left:6px}.item button{font:12px 'Space Grotesk';color:var(--gold);padding:8px;min-width:56px}.stats{padding:18px 0;border-bottom:1px solid var(--line)}.stats>span{color:var(--muted);font-size:12px}.stats>div{display:grid;grid-template-columns:1fr 1fr;gap:10px 18px;margin-top:12px}.stats label{display:flex;justify-content:space-between;font-size:11px;color:var(--muted)}.stats b{font:13px 'Space Grotesk';color:var(--text)}.relic-head{display:flex;justify-content:space-between;align-items:center;margin-top:13px}.relic-head h3{font-size:12px;font-weight:500}.relic-head span{font:12px 'Space Grotesk';color:var(--gold)}.relics{font-size:11px;color:var(--muted);line-height:1.8;display:flex;flex-wrap:wrap;gap:5px}.relics .relic{border:1px solid #55503b;padding:4px 7px;color:var(--gold);border-radius:3px}.journey{display:flex;gap:28px;align-items:center;border:1px solid var(--line);background:#161d17;border-radius:7px;padding:19px 22px;margin-top:23px}.journey h3{font-size:14px;margin:6px 0 0}.journey>div:first-child{min-width:150px}#track{display:flex;flex:1;justify-content:space-between;gap:7px}#track span{border:1px solid #3a4534;width:31px;height:31px;display:grid;place-items:center;font:12px 'Space Grotesk';color:#8e9a84;border-radius:50%}#track span.current{color:#1a2118;background:var(--gold);border-color:var(--gold)}#track span.done{background:#3b4b30;color:#c8d6b6}#track span.boss{border-radius:5px;border-color:#746043}.boss-label{font-size:11px;color:var(--muted)}footer{display:flex;justify-content:space-between;color:#6e7a68;font-size:10px;letter-spacing:1px;padding:26px 0}dialog{border:1px solid #6b654a;border-radius:10px;background:#19211b;color:var(--text);padding:30px;width:min(760px,92vw);max-height:90vh}dialog::backdrop{background:#060c0cdf;backdrop-filter:blur(5px)}dialog h2{font-size:26px;margin:9px 0 12px}dialog p{color:#aeb9a7;line-height:1.9}dialog .choices{display:grid;grid-template-columns:repeat(3,1fr);gap:13px;margin-top:22px}.choice{text-align:left;min-height:185px;padding:20px 16px;background:#232d22}.choice>span{font-size:28px;color:var(--gold);display:block;margin-bottom:15px}.choice b{display:block}.choice small{display:block;font-size:13px;line-height:1.8;color:#aab5a1;margin-top:10px}#toast{position:fixed;bottom:28px;left:50%;transform:translateX(-50%);padding:12px 22px;background:#d8b778;color:#152015;border-radius:6px;opacity:0;pointer-events:none;transition:opacity .2s;z-index:5}.hidden{display:none!important}@media(min-width:1500px){.arena{aspect-ratio:1200/700}}@media(max-width:1150px){.layout{grid-template-columns:minmax(0,1fr) 270px;gap:16px}.skill-intro{display:none}.chapter{display:none}.journey{gap:15px}.boss-label{display:none}.below{font-size:10px}.below span:last-child{display:none}}@media(max-width:850px){main{padding:24px 4% 0}.layout{grid-template-columns:1fr}.topline h1{font-size:24px}.arena{min-height:320px;aspect-ratio:auto}canvas{height:360px;object-fit:fill}.journey{flex-wrap:wrap}#track{min-width:100%;order:2}aside{padding:18px}.shop-head{margin-top:14px}.item{padding:13px 0}.stats>div{grid-template-columns:repeat(4,1fr)}.relics{min-height:28px}header{height:76px}.brand{font-size:16px}.crest{font-size:32px}.head-actions button{font-size:11px}.skillbar{padding:12px}.battle-head{padding:0 10px}.battle-head>div{gap:7px}.arena-hud{inset:16px 14px auto}.castle-health{width:170px}.center-message h2{font-size:24px}.record{font-size:11px}footer span:last-child{display:none}}@media(max-width:480px){.wave-info{display:none}.battle-head #stage{font-size:10px;padding-left:7px}.battle-head button{font-size:10px;padding:5px}.head-actions{gap:4px}.head-actions button{padding:7px}.brand{letter-spacing:1px}.center-message h2{font-size:22px}.skill{gap:6px;padding:12px 6px}.skill-symbol{font-size:23px}.skill b{font-size:11px}.skill small{font-size:10px}.stats>div{grid-template-columns:1fr 1fr}dialog .choices{grid-template-columns:1fr}.choice{min-height:100px}.choice>span{float:left;margin:0 15px 20px 0}#track{gap:3px}#track span{width:24px;height:24px;font-size:10px}h1{font-size:21px!important}.record{max-width:95px}.arena{min-height:340px}}
