:root { color-scheme:dark; --bg:#211e1f; --surface:#2a2728; --text:#f7f7f7; --muted:#b0aaad; --border:#484245; --accent:#8f94ff; }
* { box-sizing:border-box; }
body { margin:0; background:var(--bg); color:var(--text); font-family:'NanumSquare',sans-serif; }
input,button,select { font:inherit; }
a { color:inherit; text-underline-offset:4px; }
button,a,input,select { -webkit-tap-highlight-color:transparent; }
:focus-visible { outline:2px solid var(--accent); outline-offset:4px; }
button { cursor:pointer; }
.shell { max-width:430px; min-height:100dvh; margin:auto; padding:calc(18px + env(safe-area-inset-top)) 22px calc(22px + env(safe-area-inset-bottom)); display:flex; flex-direction:column; }
.screen-header { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom:30px; }
.back { display:inline-flex; align-items:center; gap:6px; min-height:44px; text-decoration:none; font-size:14px; color:var(--muted); }
.brand-link { font-size:12px; font-weight:800; letter-spacing:.06em; text-decoration:none; }
.page-title { font-size:28px; line-height:1.3; letter-spacing:-.04em; margin:0 0 10px; font-weight:800; }
.description { font-size:14px; color:var(--muted); line-height:1.65; margin:0 0 24px; }
.preview-note { border:1px solid var(--border); background:#292628; border-radius:12px; font-size:12px; line-height:1.6; color:#bdb7ba; padding:11px 13px; margin-bottom:26px; }
.preview-note strong { color:#e1dddf; font-weight:800; }
.field { display:block; margin-bottom:20px; }
.field-title { display:block; font-size:14px; font-weight:700; margin-bottom:9px; }
.field input,.search-input,select { width:100%; min-height:50px; background:#2a2728; color:var(--text); border:1px solid var(--border); border-radius:12px; padding:13px 14px; font-size:16px; }
input::placeholder { color:#827c7f; }
.field small { display:block; font-size:12px; margin-top:8px; line-height:1.5; color:var(--muted); }
.password-wrap { display:flex; border:1px solid var(--border); border-radius:12px; background:#2a2728; }
.password-wrap:focus-within { outline:2px solid var(--accent); outline-offset:3px; }
.password-wrap input { border:0; min-width:0; background:transparent; }
.password-wrap input:focus { outline:none; }
.show-password { flex-shrink:0; border:0; color:#c8c3c6; background:transparent; padding:0 14px; font-size:12px; min-width:50px; }
.primary,.secondary { min-height:50px; display:flex; align-items:center; justify-content:center; width:100%; border-radius:12px; padding:13px 18px; font-size:16px; font-weight:800; text-decoration:none; line-height:1.4; }
.primary { background:#f4f3f4; color:#211e1f; border:1px solid transparent; }
.primary:hover { background:#dedbdd; }
.secondary { background:transparent; border:1px solid var(--border); color:#e5e1e3; }
.form-links { display:flex; justify-content:center; flex-wrap:wrap; gap:24px; margin:22px 0 0; font-size:14px; color:#c7c1c4; }
.screen-footer { margin-top:auto; padding-top:38px; color:#9c9599; font-size:12px; text-align:center; }
.preview-links { display:flex; flex-wrap:wrap; justify-content:center; align-items:center; gap:8px 14px; margin:0 0 18px; font-size:12px; line-height:1.7; color:#a9a2a6; }
.preview-links span { width:100%; font-size:11px; letter-spacing:.05em; color:#9c9599; }
.preview-links a { padding:4px 0; }
.preview-links a[aria-current=page] { color:#fff; }
.agreements { border-top:1px solid var(--border); padding:18px 0 0; margin:4px 0 24px; }
.agreement-row { display:flex; align-items:flex-start; justify-content:space-between; gap:10px; margin:0 0 14px; font-size:14px; line-height:1.5; }
.agreement-row label { display:flex; gap:10px; align-items:flex-start; }
input[type=checkbox] { width:18px; height:18px; flex-shrink:0; margin:2px 0 0; accent-color:#9398ff; }
.text-button { border:0; padding:2px 0; background:transparent; color:#bdb6ba; text-decoration:underline; text-underline-offset:3px; font-size:12px; white-space:nowrap; }
.pending-panel { border:1px solid var(--border); border-radius:22px; padding:26px 22px; margin-bottom:22px; }
.clock { width:48px; height:48px; color:#acafff; margin-bottom:22px; }
.pending-panel h1 { font-size:24px; }
.pending-panel p { margin-bottom:0; }
.status-row { display:flex; justify-content:space-between; gap:12px; padding:16px 0; border-top:1px solid var(--border); font-size:14px; }
.status-row:last-child { border-bottom:1px solid var(--border); margin-bottom:24px; }
.pill { display:inline-flex; align-items:center; font-size:12px; padding:5px 9px; border-radius:7px; background:#39342e; color:#e4c68f; white-space:nowrap; }
.pill.approved { background:#2c3733; color:#a6d2b8; }.pill.suspended { background:#3d2e32; color:#e3afb8; }
.admin-shell { max-width:760px; }
.admin-heading { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.admin-heading small { color:var(--muted); font-size:12px; }
.filters { display:grid; grid-template-columns:1fr 130px; gap:10px; margin:0 0 18px; }
.filters label { min-width:0; }
.filters .field-title { font-size:12px; color:var(--muted); }
.student-card { border:1px solid var(--border); border-radius:18px; padding:18px; margin-bottom:12px; background:#282526; }
.student-top { display:flex; justify-content:space-between; align-items:center; gap:12px; }
.student-name { font-size:16px; margin:0 0 6px; }
.student-email { color:var(--muted); font-size:12px; margin:0; overflow-wrap:anywhere; }
.student-permission { display:flex; align-items:center; gap:10px; font-size:14px; margin:20px 0; }
.student-actions { display:flex; gap:8px; }
.student-actions button { min-height:42px; border:1px solid var(--border); border-radius:9px; padding:10px 14px; color:#eee; background:#363133; font-size:14px; }
.student-actions .approve { background:#eae7e9; color:#211e1f; border-color:transparent; }
.student-actions .stop { color:#e3afb8; background:transparent; }
.draft-note { color:var(--muted); font-size:12px; line-height:1.5; }
.empty { text-align:center; padding:40px 16px; border:1px dashed var(--border); border-radius:16px; color:var(--muted); font-size:14px; }
[hidden] { display:none !important; }
.notice-dialog { width:min(calc(100% - 32px),398px); border:1px solid #51494e; border-radius:22px; padding:25px; background:#2b2829; color:var(--text); }
.notice-dialog::backdrop { background:rgba(0,0,0,.65); }
.notice-dialog h2 { font-size:20px; margin:0 0 12px; }
.notice-dialog p { color:#c1babe; line-height:1.65; font-size:14px; margin:0 0 22px; }
@media(max-width:350px) { .shell{padding-left:16px;padding-right:16px}.filters{grid-template-columns:1fr}.brand-link{font-size:11px}.screen-header{gap:8px}.student-actions{flex-wrap:wrap} }

/* Registration and policy pages */
[hidden]{display:none!important}
fieldset{border:0;padding:0;margin:0;min-width:0}
.visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
.age-gate,.optional-profile,.withdraw-section{margin:24px 0;padding:20px 0;border-top:1px solid var(--border)}
.optional-profile h2,.withdraw-section h2{font-size:17px}
.optional-profile small{color:var(--muted);font-size:13px}
.legal-links{display:flex;justify-content:center;gap:18px;margin:16px 0;font-size:12px}
.legal-copy h2{font-size:18px;margin-top:30px;line-height:1.5}
.legal-copy p,.legal-copy li{font-size:14px;line-height:1.85;color:var(--muted);overflow-wrap:anywhere}
.legal-copy ul{padding-left:20px}
.legal-copy a,.agreements a,.draft-note a{color:inherit;text-underline-offset:3px}
.notice-dialog .secondary{margin-bottom:12px}