/* The drawing game uses NOLTAP's existing site identity and shared navigation. */
@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=DM+Sans:wght@400;500;600;700;800;900&family=Noto+Sans+KR:wght@400;500;600;700;800;900&display=swap');
:root{--bg:#080b10;--panel:#0e151a;--panel2:#121920;--line:#28343e;--muted:#97a5af;--text:#f0f2f0;--violet:#b9ff5f;--lavender:#b9ff5f;--orange:#ffc580;--radius:8px;--mono:'DM Mono',monospace}
body{background:var(--bg);font-family:'DM Sans','Noto Sans KR',sans-serif;min-width:320px}
.site-header{height:88px;background:transparent;border:0;backdrop-filter:none}
.header-inner{max-width:1220px;width:calc(100% - 96px);padding:0;border-bottom:1px solid #171e26;gap:24px}
.brand{gap:12px;letter-spacing:0}
.noltap-icon{width:48px;height:48px;object-fit:contain;flex:none}
.brand-name{font-family:var(--mono);font-size:23px;font-weight:700;letter-spacing:-.04em}
.brand-name>span{color:#b9ff5f}
.main-nav{margin-left:auto}
.main-nav a{color:#b5bfc5;text-decoration:none;font-size:14px;display:flex;gap:9px;align-items:center}
.main-nav small{font-family:var(--mono);color:#b9ff5f;font-size:11px}
.header-right{gap:0}
.icon-button{color:#b9ff5f;background:#0e1319;border-color:#28343e;border-radius:8px}
.main{width:calc(100% - 96px);max-width:1220px;padding:32px 0 20px}
.intro{gap:18px;margin-bottom:26px}
.eyebrow,.challenge-kicker,.section-overline,.side-label,.history-number,.result-float-label,.bottom{font-family:var(--mono);font-weight:400;letter-spacing:.08em;color:#91a4b1}
.eyebrow-line{background:#b9ff5f}
.intro h1{font-size:clamp(30px,3.5vw,44px);letter-spacing:-.06em}
.gradient-text{background:none;color:#b9ff5f;-webkit-text-fill-color:currentColor}
.intro p{font-size:15px;color:#9aaab5;line-height:1.8}
.intro-badge{background:#111b17;border:1px solid #344c2b;border-radius:8px}
.intro-badge-icon,.intro-badge strong{color:#b9ff5f}
.intro-badge span{font-size:13px}
.game-layout{grid-template-columns:minmax(0,1fr) 300px;gap:18px}
.play-area{background:transparent;border-color:var(--line);border-radius:8px}
.game-toolbar{background:#0e151a;border:1px solid var(--line);border-bottom:0;border-radius:8px 8px 0 0;padding:18px 20px}
.challenge-title strong{font-size:20px}.challenge-title>span:first-child{color:#b9ff5f}
.challenge-kicker,.metric-label{font-size:11px}.game-metrics strong{color:#f0f2f0}
.drawing-shell{height:clamp(400px,40vw,540px);border-color:var(--line);border-radius:0 0 8px 8px;background:#0b1117}
.drawing-shell::after{border-color:#28343e}
.canvas-decoration{color:#5f7f68}.state-light{background:#b9ff5f;box-shadow:none}
.canvas-placeholder{color:#a5b3bc}.placeholder-art{color:#b9ff5f}.placeholder-cursor{color:#b9ff5f}
.canvas-placeholder strong{color:#e6ede5}.canvas-state{color:#a4b0b8}
.result-float{background:#0b1216eb;border:1px solid #3b512e;border-radius:8px}
.result-float div strong{background:none;color:#b9ff5f;-webkit-text-fill-color:currentColor}
.result-float p{color:#d0ddc6}.result-details{background:#101c16;border-color:#344c2b;color:#cce3bd;border-radius:8px}
.side-card{background:#0e151a;border-color:var(--line);border-radius:8px;padding:18px}
.section-heading h2{font-size:18px}.section-overline{font-size:11px}
.side-label,.history-number{border-color:var(--line);font-size:11px}
.shape-option{background:#10181e;border-color:#28343e;border-radius:7px;box-shadow:none}
.shape-option:hover{border-color:#8eb35e}.shape-option.active{background:#1c2a1d;border-color:#8eb35e;box-shadow:none}
.shape-option strong{font-size:14px}.shape-option small{color:#94a8b4;font-size:10px}.icon-circle svg{stroke:#b9ff5f}
.icon-square svg{stroke:#a8e6ff}.icon-diamond svg{stroke:#f8c882}.icon-pentagon svg{stroke:#c5b1ff}.icon-hexagon svg{stroke:#9de2bd}
.best-score strong{color:#b9ff5f}.best-progress-track{background:#202d25}.best-progress-track div{background:#b9ff5f}
.best-caption,.history-text span{color:#9aaab5;font-size:12px}.best-caption span:last-child{color:#c1d7b4}
.history-item{background:#10181e;border-color:#28343e;border-radius:6px}.history-text strong{font-size:14px}
.history-score{color:#b9ff5f}.history-shape{background:#223322;color:#b9ff5f;border-radius:6px}
.empty-history{border-color:#28343e}.empty-history strong{font-size:14px}.empty-history>span:last-child{font-size:12px}
.empty-star,.trophy-icon,.tip-light{color:#b9ff5f}.side-tip strong{color:#c9e9a8}.side-tip p{color:#9aaab5;font-size:13px}
.button{border-radius:6px;font-size:14px}.button-primary{color:#10160a;background:#b9ff5f;box-shadow:none}
.button-primary:hover{background:#cbff8b}.button-muted{background:#121b20;border-color:#34424c;color:#d9e6d3}
.button-muted:hover{background:#1a2823}.guide-icon{background:#1b2c20;color:#b9ff5f;border-radius:6px}
.drawing-guide{color:#a5b3bc;font-size:13px}.under-footer-note{color:#97a5af;font-size:12px}
.best-medal{background:#24341e;color:#c9e9a8;border-radius:6px;font-size:11px}
.bottom{border-color:#202832;font-size:12px;align-items:center;gap:16px;flex-wrap:wrap;letter-spacing:0}
.site-links{display:flex;gap:22px;flex-wrap:wrap}.site-links a{color:#a2adb6;font-size:13px;text-decoration:none;padding:7px 0}
.site-links a:hover,.main-nav a:hover{color:#b9ff5f}
.toast{background:#16251b;border-color:#597e40;color:#e9f4e2;border-radius:8px;font-size:14px}
button:focus-visible,a:focus-visible{outline-color:#b9ff5f}
@media(max-width:1050px){.game-layout{grid-template-columns:minmax(0,1fr) 270px}.play-footer{flex-direction:column;align-items:stretch}.controls{align-self:stretch}.button{padding:0 12px}}
@media(max-width:840px){.game-layout{grid-template-columns:minmax(0,1fr)}.side-area{grid-template-columns:1fr 1fr}.side-card{min-width:0}.drawing-shell{height:480px}.intro-badge{display:none}}
@media(max-width:650px){.header-inner,.main{width:calc(100% - 32px)}.site-header{height:80px}.header-inner{gap:15px}.brand{gap:9px}.brand-name{font-size:21px}.noltap-icon{width:44px;height:44px}.main-nav a{font-size:13px}.main-nav small{display:none}.main{padding-top:26px}.intro h1{font-size:32px}.intro p{font-size:14px}.drawing-shell{height:430px}.challenge-title strong{font-size:17px}.game-toolbar{padding:14px}.side-area{display:flex}.shape-option{min-height:88px}.shapes-card .shape-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.controls{display:grid;grid-template-columns:1fr 1fr}.bottom{margin-top:28px}.site-links{gap:18px}.result-details{font-size:13px}}
@media(max-width:380px){.brand-name{font-size:19px}.header-inner{gap:10px}.noltap-icon{width:40px;height:40px}.main-nav a{font-size:12px}.intro h1{font-size:29px}.shape-option small{font-size:9px}}
.play-footer{flex-direction:column;align-items:stretch}.controls{align-self:stretch;justify-content:flex-end}.canvas-placeholder>span:last-child{color:#97a5af}
@media(max-width:650px){.side-area{align-items:stretch}.side-area>.side-card{width:100%}}
