:root{--bg:#EFF8F3;--surface:#fff;--ink:#183C2D;--muted:#587365;--green:#247A5B;--green-dark:#196247;--soft:#E4F3EB;--yellow:#FFE69B;--line:#DBE9E1;--danger:#a93c38;--shadow:0 8px 32px #183c2d06;font-family:"Pretendard","Noto Sans KR","Malgun Gothic",system-ui,sans-serif;color:var(--ink);background:var(--bg);font-synthesis:none}
*{box-sizing:border-box}body{margin:0;font-size:16px;line-height:1.6}button,input,select,textarea{font:inherit}button,a,input,select,textarea{-webkit-tap-highlight-color:transparent}button{cursor:pointer}button:disabled{cursor:default;opacity:.6}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible{outline:3px solid #be8b14;outline-offset:3px}button{border:0}a{color:inherit;text-decoration:none}h1,h2,h3,p{margin:0}h1{font-size:30px;line-height:1.4;letter-spacing:-1px}h2{font-size:20px;letter-spacing:-.5px}h3{font-size:17px}svg{width:20px;height:20px;flex-shrink:0;vertical-align:middle;stroke:currentColor;fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}.preview-bar{background:#e5ede8;border-bottom:1px solid #d4e2d9;padding:10px max(24px,calc((100vw - 1152px)/2));display:flex;justify-content:space-between;align-items:center;gap:16px;font-size:14px;color:#405c4c}.preview-bar>div,.preview-bar label{display:flex;align-items:center;gap:10px}.preview-dot{width:7px;height:7px;background:var(--green);border-radius:50%}.preview-help{font-size:13px;color:#557060}.preview-bar select{background:transparent;border:1px solid #b7cbbb;border-radius:8px;color:var(--ink);min-height:36px;max-width:180px;padding:3px 8px}.app-shell{max-width:1152px;margin:auto;padding:0 28px}.app-header{padding:36px 0 28px;display:flex;align-items:center;justify-content:space-between;gap:24px}.brand{display:flex;align-items:center;gap:12px;font-size:25px;font-weight:800;letter-spacing:-1px}.brand-tag{display:block;font-size:12px;font-weight:500;letter-spacing:0;color:var(--muted);line-height:1.2;margin-top:2px}.app-header p{font-size:15px;color:var(--muted)}.screen-nav{display:flex;gap:32px;border-bottom:1px solid var(--line);margin-bottom:36px}.nav-item{background:transparent;color:var(--muted);padding:12px 0 16px;min-height:48px;font-weight:600;position:relative}.nav-item.active{color:var(--green)}.nav-item.active:after{content:"";position:absolute;bottom:-1px;left:0;right:0;height:3px;background:var(--green);border-radius:3px}main{min-height:560px}main:focus{outline:none}.page-heading{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-bottom:28px}.eyebrow{font-size:14px;color:var(--green);font-weight:700;margin-bottom:8px;display:flex;align-items:center;gap:8px}.eyebrow span{width:5px;height:5px;border-radius:50%;background:var(--green)}.subtitle{margin-top:8px;color:var(--muted);font-size:16px}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:10px 16px;border-radius:10px;white-space:normal;font-size:15px;font-weight:650;background:var(--soft);color:var(--green);line-height:1.4}.btn-primary{background:var(--green);color:#fff;box-shadow:0 3px 8px #247a5b12}.btn-primary:hover{background:var(--green-dark)}.btn-secondary{background:#fff;border:1px solid var(--line);color:var(--ink)}.btn-ghost{background:transparent;color:var(--muted);padding:8px}.btn-small{padding:8px 12px;font-size:14px}.btn-wide{width:100%}.status-layout{display:grid;grid-template-columns:minmax(0,1fr) 304px;gap:24px;align-items:start}.panel{background:var(--surface);border:1px solid var(--line);border-radius:16px;box-shadow:var(--shadow);overflow:hidden}.panel-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:24px}.panel-heading h2{display:flex;align-items:center;gap:8px}.count{font-size:14px;color:var(--muted);font-weight:400;margin-left:4px}.summary-strip{padding:20px 24px;display:flex;align-items:center;justify-content:space-between;gap:24px;background:#f8fcf9;border-bottom:1px solid var(--line)}.summary-title{font-size:14px;color:var(--muted)}.summary-value{font-size:26px;font-weight:800;letter-spacing:-.6px;line-height:1.4}.summary-value small{font-size:14px;font-weight:500;color:var(--muted);margin-left:6px}.progress-block{flex:1;max-width:240px}.progress-copy{display:flex;justify-content:space-between;font-size:13px;margin-bottom:7px;color:var(--muted)}.progress-track{height:7px;border-radius:4px;background:var(--soft);overflow:hidden}.progress-fill{height:100%;background:var(--green);border-radius:4px}.legend{display:flex;gap:16px;font-size:13px;color:var(--muted);padding:0 24px 16px;flex-wrap:wrap}.legend span{display:flex;align-items:center;gap:6px}.legend i{width:7px;height:7px;background:#91a99b;border-radius:50%;display:inline-block}.legend .waiting{background:#c69b2b}.legend .done{background:var(--green)}.quest-list{padding:0 24px}.quest-row{padding:22px 0;display:grid;grid-template-columns:44px minmax(0,1fr);gap:14px;border-top:1px solid var(--line)}.quest-row:first-child{border-top:0}.role-icon{width:44px;height:44px;display:flex;align-items:center;justify-content:center;border-radius:12px;background:var(--soft);color:var(--green)}.quest-top{display:flex;align-items:center;justify-content:space-between;gap:8px}.role-title{font-size:17px;font-weight:700}.badge{display:inline-flex;align-items:center;gap:5px;font-size:12px;font-weight:600;padding:4px 9px;border-radius:6px;white-space:nowrap;line-height:1.5}.badge.unfinished{color:#657a6d;background:#eff4f0}.badge.pending{color:#745913;background:#fff1c4}.badge.completed{color:var(--green);background:var(--soft)}.badge.empty{color:#63776b;background:#f2f4f2}.quest-description{color:var(--muted);font-size:14px;margin:6px 0 12px;line-height:1.65;overflow-wrap:anywhere}.quest-bottom{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}.person{display:flex;align-items:center;gap:7px;font-size:14px;font-weight:600}.avatar{width:26px;height:26px;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;border-radius:50%;font-size:12px;font-weight:700;background:#e8efe9;color:#45664e}.row-actions{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}.row-note{font-size:13px;color:var(--green);display:flex;align-items:center;gap:5px}.quiet-button{background:transparent;padding:8px 2px;min-height:44px;color:var(--green);font-size:13px;text-decoration:underline;text-underline-offset:3px}.side-stack{display:flex;flex-direction:column;gap:24px}.ranking-panel .panel-heading{padding:22px 22px 12px}.ranking-note{padding:0 22px 14px;color:var(--muted);font-size:13px}.ranking-list{margin:0;padding:0 22px 18px;list-style:none}.rank-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:11px 0;border-bottom:1px solid #edf2ee;font-size:14px}.rank-row:last-child{border:0}.rank-person{display:flex;align-items:center;gap:10px}.rank-number{min-width:25px;font-size:13px;color:var(--muted)}.rank-number.first{color:#8b6917;font-weight:700}.rank-value{font-size:13px;font-weight:700;white-space:nowrap;color:var(--green)}.suggestion-panel{padding:22px;background:#e7f3ec;border:1px solid #d6e9dd;border-radius:16px}.suggestion-panel p{font-size:14px;color:var(--muted);margin:8px 0 18px}.suggestion{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-top:12px;font-size:14px}.suggestion .btn{background:#fff;flex-shrink:0}.kind-message{padding:0 8px;color:var(--muted);font-size:14px;line-height:1.8}.kind-message svg{color:var(--green);margin-right:6px}.empty-state{text-align:center;padding:48px 24px}.empty-state .empty-icon{display:flex;align-items:center;justify-content:center;width:64px;height:64px;background:var(--soft);border-radius:50%;color:var(--green);margin:0 auto 20px}.empty-icon svg{width:28px;height:28px}.empty-state h2{margin-bottom:10px}.empty-state p{max-width:350px;margin:0 auto 24px;color:var(--muted);font-size:15px}.roles-layout{display:grid;grid-template-columns:340px minmax(0,1fr);gap:24px;align-items:start}.form-panel{padding:26px}.form-panel p{margin:8px 0 24px;font-size:14px;color:var(--muted)}.field{display:block;margin-bottom:20px}.field>span{display:block;font-size:14px;font-weight:650;margin-bottom:8px}.field input,.field select,.field textarea{width:100%;border:1px solid #cdded2;border-radius:10px;background:#fff;color:var(--ink);padding:12px 13px;min-height:48px;font-size:16px;line-height:1.5}.field textarea{resize:vertical;min-height:112px}.field small{display:block;color:var(--muted);font-size:13px;margin-top:6px}.form-error{color:var(--danger);font-size:14px;margin-bottom:16px}.form-error:empty{display:none}.assignment-row{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;padding:22px 24px;border-top:1px solid var(--line)}.assignment-content{display:flex;gap:14px;min-width:0}.assignment-content .person{margin-top:7px}.assignment-meta{font-size:13px;color:var(--muted);margin-top:8px}.assignment-actions{display:flex;flex-direction:column;align-items:flex-end;gap:4px}.roles-foot{padding:20px 24px;border-top:1px solid var(--line);background:#f8fcf9;display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;font-size:14px;color:var(--muted)}.app-footer{margin-top:48px;border-top:1px solid var(--line);padding:24px 0 32px;display:flex;justify-content:space-between;font-size:13px;color:var(--muted)}dialog{border:1px solid var(--line);border-radius:16px;background:#fff;color:var(--ink);padding:0;max-width:520px;width:calc(100% - 32px);max-height:85vh;box-shadow:0 24px 80px #102c2440}dialog::backdrop{background:#163c2e66;backdrop-filter:blur(3px)}.dialog-header{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;padding:24px 28px 16px}.dialog-header p{font-size:14px;color:var(--muted);margin-top:6px}.dialog-body{padding:8px 28px 28px}.close-button{min-width:44px;min-height:44px;background:var(--soft);border-radius:10px;color:var(--green);display:flex;align-items:center;justify-content:center}.dialog-actions{display:flex;gap:10px;justify-content:flex-end}.result-metrics{display:grid;grid-template-columns:1fr 1fr;gap:16px;padding:18px 0 24px}.result-metric{background:#f0f8f3;padding:18px;border-radius:12px}.result-metric:last-child{background:#fff5d5}.result-metric span{font-size:14px;color:var(--muted);display:flex;align-items:center;gap:7px}.result-metric strong{display:block;font-size:28px;margin-top:6px}.result-metric small{font-size:14px;font-weight:500;margin-left:5px}.praise-item{margin-top:14px;padding:18px;background:#f8fbf9;border-radius:10px;overflow-wrap:anywhere}.praise-item p{font-size:15px}.praise-item small{display:block;margin-top:9px;font-size:12px;color:var(--muted)}.praise-empty{color:var(--muted);font-size:15px;padding:24px 0}.result-history{margin-top:24px;border-top:1px solid var(--line);padding-top:18px;font-size:14px;color:var(--muted)}.result-history summary{min-height:44px;cursor:pointer;color:var(--ink)}.history-row{padding:12px 0;border-bottom:1px solid var(--line);font-size:13px}.history-row span{display:block;color:var(--green);margin-top:4px}.toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);max-width:calc(100vw - 32px);background:var(--ink);color:#fff;padding:14px 22px;border-radius:12px;box-shadow:0 8px 28px #183c2d33;font-size:15px;z-index:20}.toast[hidden]{display:none}.loading{padding:60px 20px;text-align:center;color:var(--muted)}.error-panel{padding:36px;text-align:center}.error-panel p{margin-bottom:20px;color:var(--danger)}.own-marker{font-size:12px;color:var(--green);margin-left:6px}.registered-note{font-size:12px;color:var(--muted)}
@media(min-width:1400px){.app-shell{max-width:1208px}.preview-bar{padding-left:max(24px,calc((100vw - 1152px)/2));padding-right:max(24px,calc((100vw - 1152px)/2))}}
@media(max-width:960px){.status-layout{grid-template-columns:minmax(0,1fr) 270px;gap:18px}.roles-layout{grid-template-columns:300px minmax(0,1fr)}.page-heading{align-items:flex-start}.page-heading>.btn{max-width:230px}.preview-help{display:none}.assignment-row{padding:20px}.assignment-actions .btn{font-size:13px}.app-header p{font-size:14px}.quest-list{padding:0 20px}.panel-heading{padding:20px}}
@media(max-width:760px){.app-shell{padding:0 20px}.preview-bar{padding:8px 20px;font-size:12px}.preview-bar select{font-size:13px;max-width:155px}.preview-bar>div{gap:6px}.app-header{padding:28px 0 24px;align-items:flex-start;flex-direction:column;gap:12px}.app-header p{font-size:14px}.brand{font-size:24px}.screen-nav{margin-bottom:28px;gap:28px}.nav-item{font-size:15px}.page-heading{flex-direction:column;gap:20px;margin-bottom:24px}h1{font-size:27px}.subtitle{font-size:15px}.page-heading>.btn{width:100%;max-width:none;min-height:48px}.status-layout,.roles-layout{grid-template-columns:1fr}.status-layout{gap:24px}.side-stack{gap:20px}.summary-strip{padding:20px;gap:16px}.progress-block{max-width:180px}.quest-list{padding:0 20px}.quest-row{gap:12px;grid-template-columns:38px minmax(0,1fr);padding:22px 0}.role-icon{width:38px;height:38px;border-radius:10px}.role-title{font-size:16px}.quest-top{align-items:flex-start;flex-wrap:wrap}.quest-description{font-size:14px}.quest-bottom{gap:10px}.row-actions{justify-content:flex-start;gap:8px}.quest-bottom>.person{flex-basis:100%}.panel-heading{padding:20px}.legend{padding:0 20px 12px;font-size:12px;gap:14px}.assignment-row{flex-direction:column;gap:14px}.assignment-actions{flex-direction:row;align-self:stretch;justify-content:flex-end}.roles-foot{flex-direction:column;align-items:stretch}.roles-foot .btn{width:100%}.form-panel{padding:24px}.app-footer{font-size:12px;gap:12px;margin-top:36px}.app-footer span:last-child{white-space:nowrap}.dialog-header{padding:22px 20px 12px}.dialog-body{padding:8px 20px 24px}.dialog-actions>.btn{flex:1}.rank-row{padding:13px 0}.empty-state{padding:36px 20px}.suggestion-panel{padding:22px}.toast{font-size:14px;text-align:center}}
progress.progress-track{display:block;width:100%;appearance:none;border:0;color:var(--green)}progress.progress-track::-webkit-progress-bar{background:var(--soft);border-radius:4px}progress.progress-track::-webkit-progress-value{background:var(--green);border-radius:4px}progress.progress-track::-moz-progress-bar{background:var(--green);border-radius:4px}.badge svg{width:13px;height:13px}
@media(prefers-reduced-motion:no-preference){.btn,.nav-item{transition:background .15s,color .15s}.toast{animation:appear .18s ease-out}@keyframes appear{from{opacity:0;translate:0 6px}to{opacity:1;translate:0 0}}}

[hidden]{display:none!important}.account-tools,.roster-tools{display:flex;align-items:center;justify-content:flex-end;gap:16px;margin-bottom:24px}.account-tools{font-size:14px;flex-wrap:wrap}.auth-panel{max-width:600px;margin:40px auto;padding:32px}.auth-panel p{margin:16px 0 24px}.auth-panel details{margin-top:32px}.auth-panel summary{cursor:pointer;min-height:44px}.auth-panel form{margin-top:16px}
.roster-tools{flex-wrap:wrap}.role-catalog{margin-top:24px;padding:16px;background:white;border-radius:16px}.role-catalog summary{cursor:pointer;min-height:44px;font-weight:700}.import-table-wrap{max-height:350px;overflow:auto}.import-table{width:100%;border-collapse:collapse;font-size:14px}.import-table th,.import-table td{padding:12px;text-align:left;border-bottom:1px solid #dce9e1;vertical-align:top}.import-table th{position:sticky;top:0;background:#eff8f3}.import-table td:first-child{min-width:140px}.import-table td:last-child{min-width:80px}.dialog-body a{text-decoration:underline}
.student-table-wrap{overflow-x:auto}.student-table{width:100%;border-collapse:collapse;font-size:16px}.student-table th,.student-table td{text-align:left;padding:16px 24px;border-top:1px solid var(--line);vertical-align:middle}.student-table th{background:#f8fcf9}.student-table td:last-child{display:flex;gap:8px;flex-wrap:wrap}.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-width:760px){.screen-nav{gap:8px}.nav-item{flex:1;min-width:0;font-size:14px;word-break:keep-all;line-height:1.5;padding:12px 4px 16px}.student-table th,.student-table td{padding:12px 16px;min-width:110px}.student-table td:last-child{min-width:180px}.roster-tools{justify-content:flex-start;gap:8px}}
.personal-panel{padding:24px;margin-bottom:32px}.personal-panel h1{font-size:26px}.personal-panel h2{margin-top:24px;font-size:20px}.password-visibility{display:flex;align-items:center;gap:8px;min-height:44px}.password-visibility input{width:20px;height:20px}.auth-panel hr{border:0;border-top:1px solid #d8e9df;margin:24px 0}
.roles-heading h1{font-size:32px;word-break:keep-all}.role-steps{list-style:none;display:flex;gap:24px;padding:16px 24px;margin:0 0 24px;background:#e2f1e8;border:1px solid #cfe5d6;border-radius:12px}.role-steps li{display:flex;align-items:center;gap:10px;font-size:14px;font-weight:600}.role-steps li span{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:white;color:var(--green)}.role-form{border-top:4px solid var(--green)}.section-kicker{font-size:13px;font-weight:700;color:var(--green);letter-spacing:.02em;margin-bottom:8px}.selected-role-info{margin:0 0 24px;padding:16px;background:#f2f8f4;border-radius:12px}.form-panel .selected-role-info p{margin:8px 0;font-size:14px}.department-label{display:inline-block;font-size:12px;font-weight:700;color:#247052;background:#e1f2e8;padding:4px 9px;border-radius:6px}.career-note{font-size:13px;color:var(--muted);margin-top:8px}.quest-preview{background:#fff8e2;border-left:3px solid #e7bd5b;border-radius:0 8px 8px 0;padding:12px 14px;margin:16px 0}.quest-preview>span{font-size:12px;font-weight:700;color:#756025}.quest-preview p{font-size:14px;margin:6px 0 0;line-height:1.7}.form-panel .quest-preview p{margin:6px 0 0}.form-hint{padding:12px;background:#fff8e2;border-radius:8px}.assigned-panel .registered-note{margin-top:6px;font-size:14px}.assigned-panel .panel-heading{align-items:flex-start}.assignment-quests{display:flex;flex-direction:column;gap:8px;margin-top:12px}.assignment-quest{display:flex;align-items:flex-start;gap:8px;font-size:14px;line-height:1.7}.role-examples{margin-top:40px;padding-top:32px;border-top:1px solid var(--line)}.example-heading{display:flex;justify-content:space-between;align-items:center;gap:24px;margin-bottom:20px}.example-heading h2{font-size:24px}.example-heading p{font-size:14px;color:var(--muted);margin-top:8px}.example-search{width:280px;max-width:100%;flex-shrink:0}.example-search input{width:100%;min-height:48px;border:1px solid #cdded2;border-radius:10px;padding:12px 14px;background:white;font-size:16px;color:var(--ink)}.example-filters{display:flex;gap:8px;flex-wrap:wrap}.filter-chip{min-height:44px;background:white;color:var(--ink);border:1px solid #cdded2;border-radius:24px;padding:8px 16px;font-size:14px}.filter-chip[aria-pressed=true]{background:var(--green);color:white;border-color:var(--green)}.example-count{font-size:13px;color:var(--muted);margin:16px 0}.example-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.example-card{background:white;padding:20px;border:1px solid var(--line);border-radius:16px;display:flex;flex-direction:column}.example-card-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}.example-card-top svg{color:var(--green);width:22px;height:22px}.example-card h3{font-size:18px;margin-bottom:8px}.example-duty{font-size:15px;line-height:1.7;flex:1}.example-card .quest-preview{flex:1}.example-card .btn{margin-top:4px}.example-no-results{grid-column:1/-1;padding:32px;background:white;border-radius:12px;font-size:16px}.role-examples>#show-all-examples{margin-top:24px;background:white}.role-catalog{border:1px solid var(--line)}
@media(min-width:1000px){.role-form{position:sticky;top:24px}.roles-layout{grid-template-columns:360px minmax(0,1fr)}}
@media(max-width:1000px){.example-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:760px){.roles-heading h1{font-size:28px}.role-steps{gap:8px;padding:12px}.role-steps li{flex:1;gap:6px;font-size:13px;word-break:keep-all}.role-steps li span{width:24px;height:24px;flex-shrink:0}.example-heading{flex-direction:column;align-items:stretch;gap:16px}.example-search{width:100%}.example-grid{grid-template-columns:1fr}.example-filters{gap:6px}.filter-chip{padding:8px 12px}.assignment-quest{flex-direction:column;gap:4px}.role-examples{margin-top:32px}.example-card .quest-preview{margin:16px 0}.role-form{position:static}}
.class-code-banner{position:sticky;top:0;z-index:15;display:flex;justify-content:center;align-items:center;gap:20px;min-height:52px;padding:10px 20px;background:#183c2d;color:white;border-bottom:1px solid #305641}.class-code-banner strong{font-size:22px;letter-spacing:.08em;padding:2px 10px;margin-left:8px;background:#ffe69b;color:#183c2d;border-radius:6px}.class-code-banner small{font-size:14px;color:#e3efe8}.student-preview-dialog{max-width:850px}.student-preview-dialog .personal-panel{padding:20px}.student-preview-dialog .personal-panel>.panel-heading{padding:0 0 16px}.student-preview-dialog .personal-panel>p{font-size:16px;line-height:1.6;margin:12px 0}.student-preview-dialog .personal-panel>h2{font-size:18px;margin-top:24px}.preview-notice,.sample-label{padding:12px 16px;background:#eff8f3;border-radius:10px;font-size:14px;margin-bottom:16px}.sample-label{background:#fff8e2}.student-preview-dialog .personal-panel .quest-row{border-top:0}.student-preview-dialog .dialog-body{padding-top:8px}
@media(max-width:760px){.class-code-banner{gap:6px;flex-direction:column;padding:8px 16px}.class-code-banner strong{font-size:20px}.class-code-banner small{font-size:12px}.student-preview-dialog .personal-panel{padding:16px}.student-preview-dialog .result-metrics{gap:8px}.student-preview-dialog .quest-row{padding:16px 0}}
@media(min-width:1000px){.role-form{top:84px}}.role-examples,.role-form{scroll-margin-top:100px}
:where([hidden]){display:none!important}
.reward-overview{background:#fff;border:1px solid var(--line);border-radius:16px;padding:24px;margin-bottom:24px}.reward-overview-heading{display:flex;justify-content:space-between;gap:16px;margin-bottom:16px}.reward-overview-heading>span,.reward-overview>p{font-size:14px;color:var(--muted)}.reward-overview-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.reward-stat{background:var(--soft);border-radius:12px;padding:16px;display:grid;grid-template-columns:24px 1fr;gap:8px;align-items:center}.reward-stat svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.8}.reward-stat strong{grid-column:1/-1;font-size:28px;line-height:1.4}.reward-stat small{font-size:14px;margin-left:8px;font-weight:500}.reward-stat.token-stat{background:var(--yellow)}.reward-overview>p{margin-top:16px}.quest-rewards{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:12px 0}.quest-rewards>span{display:inline-flex;align-items:center;gap:4px;background:#fff1c8;border-radius:8px;padding:4px 8px;font-size:14px;font-weight:600}.quest-rewards svg{width:16px;height:16px}.quest-rewards small{color:var(--muted);font-size:14px}.list-search{display:block;padding:0 24px 16px}.list-search>span{display:block;font-size:14px;margin-bottom:8px}.list-search input{width:100%;min-height:48px;border:1px solid var(--line);border-radius:12px;padding:10px 16px;background:#fff;color:var(--ink)}.quest-toolbar .list-search{padding:0}.quest-toolbar{padding:0 24px 16px}.quest-filters{display:flex;gap:8px;flex-wrap:wrap;margin:12px 0}.quest-filters .filter-chip{min-height:44px}.filter-empty{padding:24px;color:var(--muted)}.quest-row[hidden],.assignment-row[hidden]{display:none!important}.praise-feed .praise-item{margin:0 24px 16px;background:var(--bg)}.praise-meta{display:flex;justify-content:space-between;gap:8px;font-size:14px;color:var(--muted);margin-bottom:8px}.praise-feed-actions{padding:0 24px 24px;display:grid;gap:8px}.empty-state .btn{margin:8px}.history-row .btn{margin-top:8px}.praise-feed h2{font-size:18px}
@media(max-width:600px){.reward-overview{padding:16px}.reward-overview-grid{gap:8px}.reward-stat{padding:12px 8px;grid-template-columns:1fr;gap:4px}.reward-stat svg{display:none}.reward-stat>span{font-size:14px}.reward-stat strong{font-size:24px}.reward-stat small{margin-left:4px}.quest-toolbar{padding:0 16px 16px}.list-search{padding:0 16px 16px}.praise-feed .praise-item{margin:0 16px 16px}.praise-feed-actions{padding:0 16px 16px}.reward-overview-heading{font-size:14px}.quest-filters{gap:4px}.quest-filters .filter-chip{padding:8px 10px;font-size:14px}}
.personal-metrics{grid-template-columns:repeat(3,minmax(0,1fr))}.personal-metrics .result-metric{padding:16px}.personal-metrics .result-metric:nth-child(2){background:#fff5d5}.personal-metrics .result-metric:nth-child(3){background:#f0f8f3}
@media(max-width:600px){.personal-metrics{gap:8px}.personal-metrics .result-metric{padding:12px 8px}.personal-metrics .result-metric strong{font-size:24px}.personal-metrics .result-metric small{margin-left:4px}}
.screen-nav{flex-wrap:wrap;column-gap:24px;row-gap:0}.level-settings{margin-bottom:32px}.level-settings form{padding:0 24px 24px}.level-edit-head,.level-edit-row{display:grid;grid-template-columns:56px minmax(0,1fr) minmax(90px,140px) 44px;gap:12px;align-items:center}.level-edit-head{font-size:14px;color:var(--muted);margin-bottom:8px}.level-edit-row{margin-bottom:12px}.level-edit-row input{width:100%;min-height:48px;padding:10px 12px;border:1px solid var(--line);border-radius:10px;background:#fff;color:var(--ink)}.level-row-number{font-size:14px;font-weight:700;color:var(--green)}.level-settings-actions{display:flex;gap:12px;justify-content:flex-end;margin-top:16px}.shop-product-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}.shop-products-section{margin:32px 0}.shop-products-section>.panel-heading{padding:0 0 20px}.shop-product{background:#fff;border:1px solid var(--line);border-radius:16px;padding:24px;display:flex;flex-direction:column}.shop-product-top,.shop-product-bottom{display:flex;justify-content:space-between;align-items:center;gap:12px}.shop-product h3{margin-top:16px;font-size:20px}.shop-product>p{color:var(--muted);margin:8px 0 24px;flex:1}.shop-product-bottom strong{font-size:26px}.shop-product-bottom small{font-size:14px;margin-left:6px;font-weight:500}.product-paused{background:#f8fbf9}.shop-order{padding:20px 24px;border-top:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;gap:16px}.shop-order>div:first-child{flex:1}.shop-order p{font-size:14px;color:var(--muted);margin-top:8px}.shop-order .row-actions{flex-shrink:0}.shop-help{padding:16px 24px;color:var(--muted);font-size:14px}.shop-wallet .panel-heading strong{font-size:30px}.shop-wallet .panel-heading small{font-size:16px;margin-left:8px}.level-progress{padding:20px;border-radius:12px;background:var(--soft);margin:0 24px 24px}.level-progress>div{display:flex;flex-wrap:wrap;gap:8px;align-items:center}.level-badge{background:var(--green);color:#fff;border-radius:8px;padding:4px 8px;font-size:14px;font-weight:700}.level-progress>div>span:last-child{margin-left:auto;font-size:14px;color:var(--green)}.level-progress progress{width:100%;height:8px;margin:16px 0 8px;accent-color:var(--green)}.level-progress p{font-size:14px;color:var(--muted)}.personal-panel .level-progress{margin:0 0 24px}.purchase-summary{background:var(--bg);border-radius:12px;padding:20px;margin-bottom:24px}.purchase-summary>p{color:var(--muted);margin-top:8px}.purchase-summary dl{margin:20px 0 0}.purchase-summary dl>div{display:flex;justify-content:space-between;gap:16px;margin-top:8px}.purchase-summary dd{margin:0;font-weight:700}
@media(max-width:900px){.shop-product-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.shop-order{flex-direction:column;align-items:stretch}}
@media(max-width:600px){.screen-nav{column-gap:20px}.nav-item{font-size:14px}.shop-product-grid{grid-template-columns:1fr;gap:16px}.level-settings form{padding:0 16px 16px}.level-edit-head,.level-edit-row{grid-template-columns:40px minmax(0,1fr) 72px 44px;gap:6px}.level-edit-row input{padding:10px 8px}.level-row-number{font-size:12px}.level-progress{margin:0 16px 16px;padding:16px}.shop-order{padding:16px}.shop-product{padding:20px}.shop-product h3{font-size:20px}.level-settings-actions{flex-wrap:wrap}.purchase-summary dl>div{font-size:14px}}
.notification-tools{display:flex;align-items:center;justify-content:flex-end;gap:12px;margin:0 0 16px}.notification-tools small{font-size:14px;color:var(--muted)}.notification-count{display:inline-grid;place-items:center;min-width:24px;height:24px;border-radius:12px;background:#FFE69B;color:#183C2D}.notification-item{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;padding:16px 0;border-bottom:1px solid #dcebe3}.notification-item.unread{background:#EFF8F3;border-radius:12px;padding:16px;margin:8px 0}.notification-item p{margin:8px 0;line-height:1.6;overflow-wrap:anywhere}.notification-item small{font-size:14px}.notification-item button{flex-shrink:0}@media(max-width:600px){.notification-tools{align-items:flex-start;flex-direction:column}.notification-item{flex-direction:column}}
.notification-item .row-note{white-space:nowrap;flex-shrink:0}.assignment-quest{flex-wrap:wrap}.assignment-quest .btn{margin-left:auto}
.assignment-actions .btn{white-space:nowrap}@media(max-width:900px){.roles-layout{grid-template-columns:1fr}}

/* The work itself is the primary text; evidence stays readable on small phones. */
.quest-title,.evidence-quest-title{font-size:24px;font-weight:750;line-height:1.55;color:var(--ink);white-space:normal;overflow-wrap:anywhere;word-break:normal;margin:10px 0}.quest-row .role-title{font-size:15px;font-weight:500;line-height:1.5;color:var(--muted)}.badge.rejected{color:#9b3427;background:#fff0eb}.rejection-reason{padding:12px;background:#fff0eb;border-radius:10px;color:#9b3427;font-size:15px;line-height:1.6;overflow-wrap:anywhere}.evidence-description{white-space:pre-wrap;overflow-wrap:anywhere;font-size:16px;line-height:1.7;margin:16px 0}.evidence-photo{display:block;max-width:100%;max-height:380px;height:auto;border-radius:12px;margin:16px auto;object-fit:contain}.field input[type=file]{width:100%;min-width:0;font-size:14px;white-space:normal}.field textarea{font-size:16px;line-height:1.6}.quest-row .row-actions .btn{min-height:44px}.dialog{max-height:90dvh;overflow-y:auto}.quest-row>div{min-width:0}
@media(max-width:480px){.quest-row{grid-template-columns:minmax(0,1fr)}.quest-row>.role-icon{display:none}.quest-title{font-size:23px;line-height:1.55}.evidence-quest-title{font-size:22px}.dialog-actions{flex-wrap:wrap}.dialog-actions .btn{min-height:48px}.quest-top{justify-content:flex-start}.personal-panel .quest-row{padding:24px 0}}

@media(max-width:400px){.dialog-actions{flex-direction:column-reverse}.dialog-actions>.btn{width:100%;flex:auto;white-space:nowrap}.legend{flex-wrap:wrap}}

.daily-panel{max-width:780px;margin:0 auto;padding:28px}.daily-heading h1{font-size:28px;margin:10px 0}.daily-heading>p:last-child{color:var(--muted);font-size:16px;line-height:1.6}.daily-progress{display:flex;flex-wrap:wrap;gap:8px;margin:24px 0;padding:16px;background:var(--soft);border-radius:12px}.daily-progress>span{margin-left:auto;font-size:14px;color:var(--muted)}.daily-progress progress{width:100%;height:8px;accent-color:var(--green)}.daily-checklist{list-style:none;margin:0;padding:0}.daily-item{display:grid;grid-template-columns:32px minmax(0,1fr);gap:12px;padding:22px 0;border-bottom:1px solid var(--line)}.daily-check{width:32px;height:44px;display:flex;align-items:center;justify-content:center;font-size:30px;color:var(--green);border:0;background:transparent}.daily-check.checked{font-size:26px}.daily-item .quest-title{margin:0 0 8px;font-size:23px;line-height:1.5}.daily-role{font-size:14px;color:var(--muted);margin-bottom:10px}.daily-item .badge{margin-right:8px;margin-bottom:12px}.daily-item .btn{display:block;margin-top:4px;min-height:44px}.daily-item .quiet-button{margin-top:8px;min-height:44px}.daily-done .quest-title{color:#47785f}.daily-earned{margin-top:8px;color:var(--green);font-size:14px;line-height:1.6}.daily-records{margin-top:24px}.daily-records summary{cursor:pointer;min-height:48px;font-weight:600}.daily-records .btn{margin:8px 8px 8px 0}.daily-records .level-progress{margin:8px 0 16px}.daily-password{margin-top:16px;min-height:44px;font-size:14px}.daily-empty{padding:32px 0;color:var(--muted)}.login-options{display:flex;flex-wrap:wrap;gap:12px;margin:16px 0}.login-options label{display:flex;align-items:center;gap:8px;min-height:44px}.login-options input{width:20px;height:20px}@media(max-width:480px){.daily-panel{padding:20px}.daily-heading h1{font-size:26px}.daily-progress>span{margin-left:0;width:100%}.daily-item .quest-title{font-size:22px;line-height:1.5}}
.quest-deadline{font-size:14px;line-height:1.6;color:#526d60;margin:8px 0 12px}.quest-date-fields{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px}.quest-date-fields input{min-width:0;width:100%;background:#f2f8f4}@media(max-width:480px){.quest-date-fields{grid-template-columns:minmax(0,1fr)}}
.daily-summary{position:sticky;top:8px;z-index:5;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;padding:12px 0;background:#fff;margin:12px 0 8px;border-bottom:1px solid var(--line)}.daily-summary>div{background:var(--soft);border-radius:10px;padding:10px 4px;text-align:center}.daily-summary>div:nth-child(3){background:#fff6d8}.daily-summary span{display:block;font-size:13px;color:var(--muted);white-space:nowrap}.daily-summary strong{display:block;font-size:26px;line-height:1.3}.daily-summary small{font-size:12px;margin-left:3px;font-weight:500}.daily-summary progress{grid-column:1/-1;width:100%;height:6px;accent-color:var(--green)}
@media(max-width:600px){.student-view .app-header{padding:16px 0 8px}.student-view .app-header>p,.student-view .brand-tag,.student-view .class-code-banner,.student-view .notification-tools small{display:none}.student-view .brand{font-size:22px}.student-view .brand img{width:32px;height:32px}.student-view .account-tools{margin-bottom:4px;gap:8px;flex-wrap:nowrap;font-size:13px}.student-view #account-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}.student-view .account-tools .btn{flex-shrink:0}.student-view .notification-tools{flex-direction:row;align-items:center;margin-bottom:4px}.student-view .screen-nav{margin-bottom:12px}.student-view .daily-panel{padding:16px}.student-view .daily-heading h1{font-size:24px;margin:4px 0}.student-view .daily-heading>p:last-child{font-size:14px}.student-view .daily-heading .eyebrow{font-size:13px;margin-bottom:4px}.daily-summary{gap:6px}.daily-summary span{font-size:12px}}
.daily-panel{overflow:visible}
.growth-art{width:96px;height:96px;stroke:none;fill:none;flex-shrink:0}.level-progress>.growth-art{float:right;width:88px;height:88px;margin:0 0 8px 16px}.level-progress>progress{clear:both}.growth-roadmap{padding:24px;margin:24px 0}.growth-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:12px}.growth-step{display:flex;flex-direction:column;align-items:center;text-align:center;gap:8px;padding:16px 8px;border:1px solid var(--line);border-radius:16px;background:#fff}.growth-step h3{font-size:16px}.growth-step p,.growth-step strong,.growth-step .row-note{font-size:14px}.growth-reached{background:#EFF8F3;border-color:#8FBCA2}.growth-step .btn{width:100%;margin-top:auto}.level-edit-row,.level-edit-head{grid-template-columns:58px minmax(100px,1fr) 110px 110px 44px}@media(max-width:1000px){.growth-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}@media(max-width:600px){.growth-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.growth-roadmap{padding:16px}.level-edit-row,.level-edit-head{grid-template-columns:42px minmax(60px,1fr) 65px 65px 32px;gap:4px}.level-edit-row input{min-width:0;padding:8px 4px}.level-edit-row .close-button{width:32px;min-width:32px}.level-settings{padding:12px}.growth-art{width:80px;height:80px}}
@media(max-width:600px){.level-edit-head{display:none}.level-edit-row{grid-template-columns:42px minmax(0,1fr) minmax(0,1fr) 32px;gap:8px;padding:12px 0;border-bottom:1px solid var(--line)}.level-edit-row>.level-row-number{grid-column:1;grid-row:1/3;align-self:center}.level-edit-row>label:nth-of-type(1){grid-column:2/4;grid-row:1}.level-edit-row>label:nth-of-type(2){grid-column:2;grid-row:2}.level-edit-row>label:nth-of-type(3){grid-column:3;grid-row:2}.level-edit-row>label:nth-of-type(2)>span,.level-edit-row>label:nth-of-type(3)>span{position:static;clip:auto;width:auto;height:auto;white-space:normal;font-size:14px;display:block;margin:0 0 4px}.level-edit-row>.close-button{grid-column:4;grid-row:1/3;align-self:center}}
.preview-entry{font-size:14px;font-weight:700;text-decoration:underline;text-underline-offset:4px;white-space:nowrap}.demo-intro{margin:0 0 24px}.demo-intro h2{font-size:26px;margin:8px 0}.demo-intro p{color:var(--muted)}.demo-tabs{display:flex;gap:8px;border-bottom:1px solid var(--line);margin-bottom:24px}.demo-tabs button{background:none;padding:12px 16px;min-height:48px;color:var(--ink);border-bottom:3px solid transparent;font-weight:700}.demo-tabs button[aria-selected=true]{border-color:var(--green);color:var(--green);background:#DFF2E7;border-radius:12px 12px 0 0}.demo-notice{background:#DFF2E7;padding:16px 24px;border-radius:16px;margin-bottom:16px}.demo-notice p,.demo-guide p{font-size:14px;margin:8px 0}.demo-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:16px;align-items:center}.demo-guide{border:1px solid #e4cc85;background:#FFF6D9;border-radius:16px;padding:20px 24px;margin-bottom:16px}.demo-guide h3{font-size:20px}.demo-guide span{font-size:14px;color:#68501e}.demo-feedback{min-height:24px;margin:12px 0;font-weight:600;color:var(--green)}.demo-layout{display:grid;grid-template-columns:1fr 1fr;gap:24px}.demo-panel{padding:24px;margin-bottom:24px;min-width:0}.demo-panel h2{margin-bottom:16px}.demo-panel h3{margin:12px 0}.demo-panel form{margin-top:16px}.demo-evidence{margin-top:16px;background:var(--bg);padding:16px;border-radius:12px}.demo-metrics{display:flex;gap:24px;flex-wrap:wrap;margin-bottom:16px}.demo-metrics strong{display:block;font-size:24px}.demo-panel progress{width:100%;margin:12px 0;accent-color:var(--green)}.demo-price{display:block;font-size:28px;margin:16px 0}.demo-praise{padding-top:16px;border-top:1px solid var(--line)}.demo-details{margin-top:24px}.demo-details summary{cursor:pointer;padding:12px 0}.demo-details p{padding:8px 0}.auth-panel[hidden]{display:none!important}@media(max-width:800px){.demo-layout{grid-template-columns:1fr}.app-header{flex-wrap:wrap}.demo-tabs button{padding:12px 8px;flex:1;font-size:14px}.demo-intro h2{font-size:24px}.demo-panel{padding:16px}.demo-guide,.demo-notice{padding:16px}.demo-guide .btn{flex:1}.preview-entry{margin-left:auto}}
.install-strip{display:flex;align-items:center;justify-content:space-between;gap:16px;border:1px solid var(--line);border-radius:12px;padding:12px 16px;margin:0 0 20px;background:white}.install-strip>div{display:flex;flex-direction:column;font-size:14px}.install-strip span{color:var(--muted)}.install-strip .btn{flex-shrink:0}.install-dialog{max-width:620px;width:calc(100% - 32px);max-height:85dvh;border:0;border-radius:16px;padding:0;color:var(--ink);background:white}.install-dialog::backdrop{background:#183c2d66}.install-help{padding:24px}.install-help section{margin:16px 0;padding:16px;border:1px solid var(--line);border-radius:12px}.install-help .install-recommended{background:#EFF8F3;border-color:#247A5B}.install-help ol{padding-left:24px;margin-bottom:0}.install-help li{margin:8px 0;line-height:1.6}.install-message{color:var(--green);margin-top:12px}.install-strip[hidden],.install-now[hidden]{display:none!important}@media(max-width:600px){.install-strip{align-items:stretch;flex-direction:column;gap:8px}.install-strip .btn{width:100%}.install-help{padding:16px}.install-help .panel-heading{align-items:flex-start}.install-help h2{font-size:22px}}
.writing-choices{display:flex;gap:8px;flex-wrap:wrap;margin:8px 0}.choice-button{min-height:44px;padding:8px 12px;border:1px solid #9bb6a6;border-radius:10px;background:#fff;color:#183C2D;font-size:15px}.choice-button[aria-pressed=true]{background:#DFF2E7;border:2px solid #247A5B;font-weight:700}.choice-note{display:block;color:var(--muted);font-size:14px;line-height:1.6;margin:4px 0 8px}.review-reason{margin:16px 0}.review-reason>summary{min-height:44px;padding:10px 0;cursor:pointer;font-weight:600}.review-reason textarea{background:#fff}.status-layout+.reward-overview{margin-top:24px}.page-heading .subtitle{font-size:16px}.install-strip{margin-top:24px}.screen-nav{margin-bottom:24px}.app-header{padding-bottom:16px}.btn,.quiet-button{min-height:44px}.demo-intro{margin-bottom:16px}.demo-intro h2{font-size:24px}@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}
.batch-item{padding:16px 0;border-bottom:1px solid var(--line)}.batch-item label{display:flex;align-items:center;gap:12px;min-height:44px;cursor:pointer}.batch-item input{width:22px;height:22px;accent-color:var(--green)}.batch-item p{margin:8px 0}.batch-description{background:#f3f6f4;padding:12px;border-radius:10px;white-space:pre-wrap}.quick-record-preview{font-size:14px;color:var(--green);min-height:24px;margin:8px 0}.tier-art{stroke:none}.badge.unfinished{background:#edf0ee;color:#43564b}.badge.pending{background:#fff0bc;color:#72551b}.badge.completed{background:#dff3e8;color:#176247}.badge.rejected{background:#fde9e8;color:#9e302b}
.role-icon{background:#E4F1EA;border:1px solid #D1E6D9;border-radius:14px;box-shadow:inset 0 1px 0 #ffffffb3}.role-icon svg{width:24px;height:24px;stroke-width:1.7}.tier-art{filter:drop-shadow(0 3px 3px #183c2d0a)}.brand img{border-radius:13px}
