:root{--font-body: "Hiragino Kaku Gothic ProN", "Avenir Next", "Trebuchet MS", sans-serif;--font-heading: "Avenir Next", "Hiragino Sans", "Trebuchet MS", sans-serif;--font-display: Georgia, "Times New Roman", serif;--bg: #dff2ff;--bg-secondary: #eef8ff;--surface: rgba(245, 251, 255, .82);--panel: rgba(255, 255, 255, .78);--border: rgba(38, 86, 132, .14);--input-border: rgba(38, 86, 132, .18);--text: #20364b;--text-strong: #11253c;--muted: #5c748c;--brand: #3390dc;--brand-deep: #176bb3;--accent: #64b9ff;--danger: #b42318;--radius-xl: 28px;--radius-2xl: 36px;--shadow: 0 24px 70px rgba(28, 74, 118, .14)}*{box-sizing:border-box}html,body{min-height:100%}#root{min-height:100dvh}body{margin:0;color:var(--text);font-family:var(--font-body);background:radial-gradient(circle at top left,rgba(51,144,220,.24),transparent 28%),radial-gradient(circle at top right,rgba(100,185,255,.18),transparent 24%),linear-gradient(180deg,#f8fcff 0%,var(--bg) 58%,#cfeaff 100%);background-attachment:fixed}a{color:inherit}code{font-family:ui-monospace,SFMono-Regular,SF Mono,Menlo,Consolas,monospace;font-size:.92em;background:#14202b0f;border-radius:8px;padding:.15rem .4rem}h1,h2,h3{margin:0;color:var(--text-strong);font-family:var(--font-heading);line-height:1.1}h1{font-size:clamp(2rem,4.2vw,3.6rem);margin-bottom:.9rem}h2{font-size:clamp(1.35rem,2.2vw,2rem)}h3{font-size:1.12rem}p{margin:0}label{display:block;margin:1rem 0 .45rem;font-weight:700;color:var(--text-strong)}label.inline{display:inline-flex;align-items:center;gap:.7rem;margin:0}label.inline input{width:auto}input,select,textarea{width:100%;border:1px solid var(--input-border);border-radius:18px;padding:.95rem 1rem;background:#ffffffd6;color:var(--text-strong);font:inherit;transition:border-color .16s ease,box-shadow .16s ease,transform .16s ease}select{border-radius:12px}input:focus,select:focus,textarea:focus{outline:none;border-color:#3390dc8c;box-shadow:0 0 0 4px #3390dc24}textarea{min-height:150px;resize:vertical}button,.btn{-webkit-appearance:none;-moz-appearance:none;appearance:none;display:inline-flex;align-items:center;justify-content:center;gap:.45rem;border-radius:999px;border:1px solid rgba(20,32,43,.12);background:#ffffffd6;color:var(--text-strong);cursor:pointer;font:inherit;font-weight:700;text-decoration:none;padding:.82rem 1.15rem;transition:transform .16s ease,background .16s ease,box-shadow .16s ease}button:hover,.btn:hover{transform:translateY(-1px);background:#fffffffa;box-shadow:0 14px 32px #14202b1a}button:disabled,.btn:disabled{opacity:.55;cursor:not-allowed;transform:none;box-shadow:none}button:focus-visible,.btn:focus-visible{outline:2px solid var(--brand);outline-offset:2px}button:active:not(:disabled),.btn:active:not(:disabled){transform:scale(.97);box-shadow:none}button.primary,.btn.primary,button[type=submit]{color:#fff;border-color:transparent;background:linear-gradient(135deg,var(--brand),var(--brand-deep))}button.primary:hover,.btn.primary:hover,button[type=submit]:hover{background:linear-gradient(135deg,var(--brand-deep),#0e5a96)}button.danger{color:var(--danger);border-color:#b423182e}button.danger:hover{background:#b4231814}.page-shell{max-width:1180px;margin:0 auto;padding:1.8rem 1.1rem 3.8rem}.site-footer{padding:0 1.1rem 1.6rem}.site-footer-inner{max-width:1180px;margin:0 auto;padding-top:.4rem;color:var(--muted);font-size:.9rem;text-align:center}.page-header{display:flex;justify-content:space-between;align-items:flex-end;gap:1.5rem;margin-bottom:1.3rem}.page-header.compact{align-items:flex-start}.page-copy{max-width:60ch;color:var(--muted);line-height:1.7;font-size:1.02rem}.eyebrow{margin-bottom:.7rem;color:var(--brand-deep);font-size:.78rem;font-weight:800;letter-spacing:.16em;text-transform:uppercase}.muted{color:var(--muted)}.field-hint{margin-top:.5rem;color:var(--muted);font-size:.94rem}.status-message{margin-top:1rem;padding:.9rem 1rem;border-radius:16px;border:1px solid var(--border);background:#ffffffa6}.status-message.error{color:var(--danger);border-color:#b4231829;background:#b4231814}.status-message.success{color:#166534;border-color:#22c55e33;background:#22c55e14}.auth-note{margin-top:1rem;color:var(--muted);line-height:1.7}.auth-chip{display:inline-flex;align-items:center;min-height:48px;padding:.7rem 1rem;border-radius:999px;border:1px solid rgba(23,107,179,.16);background:#ffffffb8;color:var(--brand-deep);font-size:.92rem;font-weight:700}.field-hint-valid{color:var(--brand-deep);font-weight:700}.surface-card{border-radius:var(--radius-xl);border:1px solid var(--border);background:var(--surface);box-shadow:var(--shadow);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}.button-row{display:flex;align-items:center;flex-wrap:wrap;gap:.7rem}.home-shell{padding-top:2.6rem}.home-brand{display:flex;justify-content:center;margin-bottom:1.1rem}.home-brand-image{width:min(100%,420px);height:auto;display:block}.hero-panel{position:relative;overflow:hidden;padding:2.25rem clamp(1.5rem,5vw,3.25rem);border-radius:var(--radius-2xl);background:linear-gradient(135deg,#236cb4f5,#3f97e4eb);box-shadow:0 32px 80px #1c4a763d}.hero-panel:after{content:"";position:absolute;inset:auto -10% -18% auto;width:280px;height:280px;border-radius:50%;background:radial-gradient(circle,rgba(235,248,255,.38),transparent 70%)}.hero-panel h1,.hero-panel .eyebrow{color:#fffaf3}.hero-panel h1{max-width:18ch}.hero-panel .page-copy{color:#f5f7fad4}.hero-copy{position:relative;z-index:1}.role-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.25rem;margin-top:1.35rem}.role-card{display:flex;flex-direction:column;gap:.9rem;min-height:260px;padding:1.7rem;border-radius:var(--radius-xl);border:1px solid var(--border);background:#ffffffb8;text-decoration:none;box-shadow:var(--shadow);transition:transform .18s ease,border-color .18s ease,background .18s ease}.role-card:hover{transform:translateY(-3px)}.student-card:hover{border-color:#3390dc4d}.teacher-card:hover{border-color:#176bb357}.role-card p{color:var(--muted);line-height:1.7}.role-kicker{font-size:clamp(1.4rem,2.4vw,2rem);font-weight:800;text-transform:uppercase;letter-spacing:.14em;color:var(--brand-deep);line-height:1}.role-action{margin-top:auto;font-weight:800;color:var(--brand-deep)}.quick-start{margin-top:1.35rem;padding:1.5rem}.quick-start h3{margin-bottom:.9rem}.quick-start-list{margin:0;padding-left:1.2rem;color:var(--muted);line-height:1.75}.center-panel{min-height:calc(100vh - 170px);display:flex;align-items:center;justify-content:center}.auth-card,.submission-confirmation{max-width:660px;padding:clamp(1.7rem,4vw,2.6rem)}.submission-confirmation-wide{max-width:none;margin-bottom:1.25rem}.student-layout{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(300px,.85fr);gap:1.25rem}.classroom-layout{display:grid;grid-template-columns:minmax(320px,.82fr) minmax(0,1.18fr);gap:1.25rem;margin-bottom:1rem}.student-form-panel,.student-helper-panel,.classroom-create-panel,.classroom-list-panel,.feedback-tool-panel,.teacher-detail-panel,.teacher-list-panel,.export-layout{padding:1.45rem}.student-stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.75rem;margin:1.15rem 0}.stat-chip,.stat-card{display:flex;flex-direction:column;gap:.5rem}.stat-chip{padding:1rem;border-radius:18px;border:1px solid var(--border);background:var(--panel)}.stat-chip span,.stat-card span{color:var(--muted);font-size:.78rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase}.stat-chip strong,.stat-card strong{color:var(--text-strong);font-size:1.32rem}.draft-note{margin-top:1rem;color:var(--muted);line-height:1.7}.student-history-panel{margin-top:1.25rem;padding:1.45rem}.student-feedback-card{margin-top:1rem;padding:1rem;border-radius:20px;border:1px solid rgba(51,144,220,.18);background:#e9f6ffc7}.student-history-list{display:grid;gap:.9rem}.saved-submission-card{padding:1.15rem;border-radius:22px;border:1px solid var(--border);background:var(--panel)}.saved-submission-card.is-latest{border-color:#3390dc47;box-shadow:0 18px 44px #1c4a7614}.saved-submission-text{margin:0;color:var(--text-strong);line-height:1.8;white-space:pre-wrap}.confirmation-meta{display:flex;flex-wrap:wrap;gap:.7rem;margin:1.1rem 0 1.5rem}.confirmation-meta span{padding:.7rem .95rem;border-radius:999px;border:1px solid var(--border);background:var(--panel);font-weight:700}.stats-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.9rem;margin-bottom:1rem}.stat-card{min-height:128px;justify-content:space-between;padding:1.2rem}.filter-panel{margin-bottom:1rem;padding:1.25rem}.feedback-tool-panel{margin-bottom:1rem}.toolbar-grid{display:grid;grid-template-columns:minmax(0,1.65fr) repeat(2,minmax(160px,1fr)) auto;gap:.9rem;align-items:end}.toggle-row{align-self:end;min-height:56px;padding:.9rem 1rem;border-radius:18px;border:1px solid var(--border);background:var(--panel)}.classroom-stack{display:grid;gap:.9rem}.classroom-card{padding:1rem;border-radius:22px;border:1px solid var(--border);background:var(--panel)}.classroom-card.is-active{border-color:#3390dc38}.classroom-card.is-inactive{opacity:.82}.classroom-name{font-size:1.08rem;font-weight:800;color:var(--text-strong)}.status-badge{display:inline-flex;align-items:center;padding:.45rem .8rem;border-radius:999px;font-size:.8rem;font-weight:800}.status-badge.active{background:#3390dc24;color:var(--brand-deep)}.status-badge.inactive{background:#5c748c24;color:var(--muted)}.status-badge.feedback-draft{background:#ffbc422e;color:#8a5a00}.status-badge.feedback-published{background:#22c55e24;color:#166534}.status-badge.feedback-none{background:#5c748c24;color:var(--muted)}.dashboard-layout{display:grid;grid-template-columns:1fr;gap:1.25rem;align-items:start}.teacher-detail-panel{position:sticky;top:1.5rem;max-height:calc(100vh - 3rem);overflow-y:auto}.teacher-review-panel{scroll-margin-top:1rem}.collapsible-block{margin-bottom:1rem}.collapsible-toggle{width:100%;display:flex;justify-content:space-between;align-items:center;gap:1rem;text-align:left;cursor:pointer;padding:1.1rem 1.45rem}.collapsible-toggle .eyebrow{margin-bottom:.3rem}.collapsible-label{font-size:1.12rem;font-weight:700;color:var(--text-strong);font-family:var(--font-heading)}.collapse-hint{color:var(--muted);font-size:.9rem;font-weight:600;white-space:nowrap;flex-shrink:0}.collapsible-body{margin-top:.75rem}.panel-toggle{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:100%;display:flex;justify-content:space-between;align-items:center;gap:1rem;text-align:left;cursor:pointer;background:none;border:none;padding:0;font:inherit;margin-bottom:0}.panel-toggle h2{color:var(--text-strong)}.selection-bar{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:.6rem 0 .85rem;margin-bottom:.85rem;border-bottom:1px solid var(--border)}.submission-card.feedback-draft{border-left:3px solid #d97706}.submission-card.feedback-published{border-left:3px solid #16a34a}.card-actions{margin:.85rem 0 0}.feedback-editor-head{display:flex;justify-content:space-between;align-items:center;gap:.75rem;margin-bottom:0}.feedback-editor-head label{margin:.85rem 0 .45rem}.amber-section{background:linear-gradient(135deg,#fbbf241a,#f59e0b0f)!important;border-color:#f59e0b47!important}.amber-section .eyebrow{color:#b45309}.amber-section .collapsible-label{color:#92400e}.amber-section .collapse-hint{color:#b45309}.ai-instructions-grid{display:grid;grid-template-columns:1fr 1fr;gap:1.25rem;margin-top:1rem}.file-label{display:inline-flex;align-items:center;gap:.5rem;margin-top:.5rem;padding:.6rem 1rem;border-radius:999px;border:1px solid rgba(20,32,43,.12);background:#ffffffd6;color:var(--text-strong);font-weight:700;font-size:.92rem;cursor:pointer}.file-label:hover{background:#fff}.file-input-hidden{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#11253c80;display:flex;align-items:center;justify-content:center;z-index:200;padding:1.5rem;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.modal-card{max-width:540px;width:100%;max-height:80vh;overflow-y:auto;padding:1.45rem}.student-roster{margin-top:.5rem}.student-row{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:.75rem 0;border-bottom:1px solid var(--border)}.student-row:last-child{border-bottom:none}.student-row-name{display:block;font-weight:700;color:var(--text-strong)}.student-row-meta{font-size:.88rem}@media (max-width: 720px){.ai-instructions-grid{grid-template-columns:1fr}}.teacher-list-panel-wide{min-width:0}.panel-head{display:flex;justify-content:space-between;align-items:flex-start;gap:1rem;margin-bottom:1rem}.detail-meta{margin-top:.65rem;color:var(--muted);line-height:1.6}.detail-facts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.75rem;margin:1rem 0 1.1rem;padding:0}.detail-facts>div{padding:.95rem 1rem;border-radius:18px;border:1px solid var(--border);background:var(--panel)}.detail-facts dt{margin-bottom:.4rem;color:var(--muted);font-size:.76rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase}.detail-facts dd{margin:0;color:var(--text-strong);font-weight:700}.detail-body{min-height:320px;padding:1.25rem;border-radius:22px;border:1px solid var(--border);background:var(--panel)}.detail-body p{white-space:pre-wrap;line-height:1.8}.detail-body-compact{min-height:0}.feedback-editor{margin-top:1.25rem;padding-top:1.25rem;border-top:1px solid var(--border)}.feedback-source-card{margin-top:1rem;padding:1rem;border-radius:20px;border:1px solid var(--border);background:#ffffffb8}.empty-state{padding:1.7rem .8rem;text-align:center;color:var(--muted)}.submission-stack{display:grid;gap:.9rem}.submission-stack-scrollable{max-height:72vh;overflow-y:auto;padding-right:.3rem;scrollbar-gutter:stable}.panel-actions{display:flex;justify-content:space-between;align-items:center;gap:1rem;margin-top:1rem;padding-top:1rem;border-top:1px solid var(--border)}.submission-card{padding:1.15rem;border-radius:22px;border:1px solid var(--border);background:var(--panel);transition:transform .16s ease,box-shadow .16s ease,border-color .16s ease}.submission-card.is-active{border-color:#3390dc47;box-shadow:0 18px 44px #1c4a7614}.submission-card:hover{transform:translateY(-1px)}.submission-expanded{margin-top:1.15rem;padding-top:1.15rem;border-top:1px solid var(--border)}.submission-top h3{margin:.55rem 0 .35rem}.submission-select-row{display:flex;justify-content:space-between;align-items:center;gap:.9rem;margin-bottom:.9rem}.selection-toggle{min-height:40px;padding:.55rem .8rem;border-radius:999px;border:1px solid var(--border);background:#ffffffb3}.meta-row{display:flex;flex-wrap:wrap;align-items:center;gap:.6rem}.class-pill{display:inline-flex;align-items:center;padding:.45rem .8rem;border-radius:999px;background:#3390dc24;color:var(--brand-deep);font-size:.84rem;font-weight:800}.card-preview{margin:.95rem 0 0;color:var(--muted);line-height:1.75}.export-layout{margin-top:1rem}.combined{min-height:62vh;border:none;border-radius:22px;background:#12304ff5;color:#f8fafc;padding:1.25rem;font-family:ui-monospace,SFMono-Regular,SF Mono,Menlo,Consolas,monospace;font-size:.95rem;line-height:1.7;white-space:pre-wrap;word-break:break-word}.display-page{min-height:100vh;background:linear-gradient(180deg,#0f3f67,#dcefff)}.display-toolbar{position:sticky;top:0;z-index:10;display:flex;flex-wrap:wrap;gap:.65rem;padding:1rem 1.1rem;background:#0a2a46e0;border-bottom:1px solid rgba(255,255,255,.08);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}.display-toolbar button{color:#fff;border-color:#ffffff24;background:#ffffff14}.display-toolbar button:hover{background:#ffffff29}.display-toolbar button:focus-visible{outline-color:#ffffffb3}.display-position{margin-left:auto;align-self:center;color:#ffffffb8;font-weight:700}.display-shell{max-width:1180px;margin:0 auto;padding:1.55rem 1rem 2.6rem}.display-header{margin-bottom:1rem}.display-title{max-width:22ch;margin:.75rem 0 .7rem;color:#fff;font-size:clamp(2rem,5vw,4rem)}.display-meta{color:#ffffffc7;line-height:1.6}.display-paper{padding:clamp(1.35rem,4vw,2.8rem);border-radius:32px;background:#fffcf8f5;box-shadow:0 34px 70px #0000002e}.display-text{margin:0;color:#17202e;line-height:1.62;white-space:pre-wrap;font-family:var(--font-display)}@media (max-width: 980px){.role-grid,.student-layout,.classroom-layout,.dashboard-layout,.stats-grid{grid-template-columns:1fr}.toolbar-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (max-width: 720px){.page-shell{padding:1rem .85rem 2.5rem}.page-header{flex-direction:column;align-items:stretch}.toolbar-grid,.detail-facts,.student-stats{grid-template-columns:1fr}.submission-select-row,.panel-actions{flex-direction:column;align-items:stretch}.button-row>*{flex:1 1 180px}.hero-panel{padding:1.6rem 1.25rem}.display-toolbar{padding:.85rem}.display-position{width:100%;margin-left:0}.display-paper{border-radius:24px}}
