:root { color-scheme:light; --bg:#fff; --text:#202b3b; --muted:#687586; --blue:#0085d5; --border:#b9dff5; }
    * { box-sizing:border-box; }
    html, body { margin:0; min-height:100%; background:var(--bg); }
    body { font-family:"NanumSquare",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; color:var(--text); -webkit-text-size-adjust:100%; }
    a { color:inherit; -webkit-tap-highlight-color:transparent; }
    a:focus-visible { outline:2px solid var(--blue); outline-offset:4px; }
    .app { width:min(100%,430px); min-height:100vh; min-height:100dvh; margin:0 auto; padding:calc(48px + env(safe-area-inset-top)) 24px calc(24px + env(safe-area-inset-bottom)); display:flex; flex-direction:column; }
    .brand { width:min(210px,100%); margin:0 auto 48px; text-align:center; }
    .wordmark { display:block; width:100%; height:auto; }
    .brand-name { margin-top:10px; font-size:.6875rem; line-height:1.5; font-weight:400; letter-spacing:.14em; color:var(--blue); }
    .menu-list { display:flex; flex-direction:column; gap:12px; }
    .tile { min-height:84px; border:1px solid var(--border); border-radius:15px; background:#fff; padding:18px; text-decoration:none; display:flex; align-items:center; gap:16px; transition:background-color .15s,border-color .15s; }
    .tile:active { background:#edf7fe; border-color:var(--blue); }
    .menu-icon { width:24px; height:24px; flex:0 0 24px; color:var(--blue); }
    .label { min-width:0; font-size:1rem; line-height:1.45; font-weight:400; letter-spacing:-.02em; word-break:keep-all; overflow-wrap:anywhere; }
    .label small { display:block; margin-top:5px; color:var(--muted); font-size:.8125rem; line-height:1.45; font-weight:400; letter-spacing:0; }
    footer { margin-top:auto; padding-top:64px; text-align:center; color:var(--muted); font-size:.6875rem; line-height:1.6; }
    .admin-link { display:inline-flex; align-items:center; min-height:44px; font-size:.75rem; text-decoration:none; }
    footer p { margin:4px 0 0; }
    @media (hover:hover) { .tile:hover { background:#f5faff; border-color:var(--blue); } .admin-link:hover { color:var(--blue); } }
    @media (max-width:350px) { .app { padding-left:18px; padding-right:18px; } .tile { padding:16px; gap:12px; } }
    @media (prefers-reduced-motion:reduce) { .tile { transition:none; } }
  
.app{padding-top:calc(28px + env(safe-area-inset-top))}.brand{margin-bottom:30px}.back{display:inline-flex;align-items:center;min-height:44px;text-decoration:none;font-size:.8125rem;color:var(--muted);margin-bottom:20px}h1{font-size:1.5rem;font-weight:700;margin:0 0 10px;letter-spacing:-.04em}.intro{font-size:.9375rem;line-height:1.7;color:var(--muted);margin:0 0 26px;word-break:keep-all}.subject-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.subject-grid .tile{padding:17px 14px;min-height:90px;gap:10px}.subject-grid .label{font-size:.9375rem}.subject-grid .menu-icon{width:19px;height:19px;flex-basis:19px}.empty{border:1px solid var(--border);border-radius:15px;padding:28px 20px;font-size:.9375rem;line-height:1.8;color:var(--muted);text-align:center}.path{font-size:.75rem;color:var(--blue);margin:0 0 12px}.tile.lesson-link{align-items:flex-start}.pill{display:inline-block;border-radius:6px;background:#edf7fe;color:var(--blue);font-size:.75rem;padding:4px 8px;margin-bottom:10px}.lesson-detail{font-size:.8125rem;line-height:1.8;color:var(--muted);margin:16px 0}.arrow{margin-left:auto;color:var(--blue)}