:root{--bg:#eef4ff;--panel:#ffffffe0;--panel-strong:#fff;--ink:#172033;--muted:#667085;--line:#19233c1f;--accent:#635bff;--accent-dark:#4438ca;--accent-2:#06b6d4;--accent-3:#f97316;--soft:#eef2ff;--success:#079455;--danger:#d92d20;--shadow:0 24px 80px #1f293721;--shadow-soft:0 12px 32px #1f293714}*{box-sizing:border-box}html,body{max-width:100vw;min-height:100%;overflow-x:hidden}body{color:var(--ink);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:radial-gradient(circle at 8% 5%,#635bff42,#0000 34%),radial-gradient(circle at 86% 12%,#06b6d447,#0000 30%),linear-gradient(135deg,#f8fbff 0%,#eef4ff 44%,#fff7ed 100%);margin:0;font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}body:before{pointer-events:none;content:"";background-image:linear-gradient(#635bff12 1px,#0000 1px),linear-gradient(90deg,#635bff12 1px,#0000 1px);background-size:36px 36px;position:fixed;inset:0;-webkit-mask-image:linear-gradient(#0000008c,#0000 74%);mask-image:linear-gradient(#0000008c,#0000 74%)}button,input,select,textarea{font:inherit}button{cursor:pointer;border:0}button:disabled{cursor:not-allowed;opacity:.62}input,select,textarea{border:1px solid var(--line);width:100%;min-height:48px;color:var(--ink);background:#ffffffeb;border-radius:16px;outline:0;padding:12px 14px;transition:border-color .18s,box-shadow .18s,transform .18s;box-shadow:inset 0 1px #fffc}textarea{resize:vertical;line-height:1.5}input:focus,select:focus,textarea:focus{border-color:#635bffb8;box-shadow:0 0 0 4px #635bff24}.app-shell{width:min(1440px,100% - 36px);margin:0 auto;padding:28px 0 46px;position:relative}.app-shell.narrow{width:min(760px,100% - 32px)}.hero{grid-template-columns:minmax(0,1fr) minmax(310px,420px);align-items:stretch;gap:22px;margin-bottom:18px;display:grid}.hero-copy,.hero-card,.panel,.control-band,.notice{-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px)}.hero-copy{box-shadow:var(--shadow);background:linear-gradient(135deg,#fffffff0,#ffffffb8),radial-gradient(circle at 90% 12%,#f9731629,#0000 28%);border:1px solid #ffffffb8;border-radius:34px;padding:clamp(24px,4vw,44px);position:relative;overflow:hidden}.hero-copy:after{content:"";background:linear-gradient(135deg,#635bff2e,#06b6d42e);border-radius:999px;width:240px;height:240px;position:absolute;bottom:-90px;right:-70px}.eyebrow,.section-kicker{width:fit-content;color:var(--accent-dark);letter-spacing:.08em;text-transform:uppercase;background:#635bff17;border:1px solid #635bff2e;border-radius:999px;align-items:center;margin:0 0 10px;padding:6px 10px;font-size:12px;font-weight:950;display:inline-flex}.section-kicker{margin-bottom:8px;padding:4px 9px;font-size:11px}h1,h2,p{margin:0}h1{z-index:1;letter-spacing:-.05em;max-width:850px;font-size:clamp(38px,5.5vw,72px);line-height:.98;position:relative}h2{letter-spacing:-.02em;font-size:22px}.hero-description{z-index:1;max-width:720px;color:var(--muted);margin-top:16px;font-size:clamp(16px,2vw,19px);line-height:1.6;position:relative}.hero-actions{z-index:1;flex-wrap:wrap;align-items:center;gap:12px;margin-top:28px;display:flex;position:relative}.hero-card{min-height:318px;box-shadow:var(--shadow);color:#fff;background:radial-gradient(circle at 72% 14%,#ffffff38,#0000 28%),linear-gradient(145deg,#17132f 0%,#332278 52%,#0e7490 100%);border:1px solid #ffffff47;border-radius:34px;flex-direction:column;justify-content:space-between;padding:24px;display:flex;position:relative;overflow:hidden}.hero-card:before{content:"";filter:blur(2px);background:#f97316d1;border-radius:999px;width:220px;height:220px;position:absolute;inset:auto -58px -62px auto}.hero-card-top,.hero-steps,.hero-score{z-index:1;position:relative}.hero-card-top{justify-content:space-between;align-items:center;gap:14px;display:flex}.hero-card-top span{color:#ffffffad;letter-spacing:.12em;font-size:12px;font-weight:950}.hero-card-top strong{letter-spacing:.08em;background:#ffffff24;border-radius:999px;padding:8px 12px}.hero-steps{gap:10px;display:grid}.hero-steps span{color:#ffffffe0;background:#ffffff1a;border:1px solid #ffffff29;border-radius:18px;padding:12px 14px;font-weight:850}.hero-score strong{letter-spacing:-.08em;font-size:76px;line-height:.9;display:block}.hero-score span{color:#ffffffc2;font-weight:850}.status-pill,.badge{color:#3538cd;white-space:nowrap;background:#eef2ffe6;border-radius:999px;align-items:center;min-height:36px;padding:8px 12px;font-size:13px;font-weight:900;display:inline-flex}.status-pill{border:1px solid #635bff1f;gap:8px}.status-pill span{background:var(--accent-3);border-radius:999px;width:9px;height:9px;box-shadow:0 0 0 4px #f9731624}.status-pill.ready span{background:var(--success);box-shadow:0 0 0 4px #07945524}.control-band{box-shadow:var(--shadow-soft);background:#ffffffc7;border:1px solid #ffffffad;border-radius:26px;justify-content:space-between;align-items:center;gap:14px;margin-bottom:16px;padding:14px 16px;display:flex}.join-form{grid-template-columns:minmax(170px,260px) auto;gap:10px;display:grid}button,.join-form button,.create-form button,.model-form button,.score-button{background:linear-gradient(135deg, var(--accent), var(--accent-dark));color:#fff;border-radius:16px;min-height:48px;padding:0 18px;font-weight:950;transition:transform .18s,box-shadow .18s,filter .18s;box-shadow:0 12px 24px #4f46e538}button:hover:not(:disabled){filter:brightness(1.04);transform:translateY(-1px);box-shadow:0 16px 30px #4f46e547}.room-code,.room-meta{color:var(--muted);align-items:center;gap:10px;display:flex}.room-code strong{color:var(--ink);letter-spacing:.1em;font-size:32px}.room-meta span{color:var(--accent-dark);background:#635bff14;border-radius:999px;padding:8px 12px;font-size:13px;font-weight:900}.notice{color:#3538cd;box-shadow:var(--shadow-soft);background:#ffffffd1;border:1px solid #635bff33;border-radius:20px;margin-bottom:16px;padding:14px 16px;font-weight:850}.panel{background:var(--panel);box-shadow:var(--shadow-soft);border:1px solid #ffffffb3;border-radius:28px;padding:20px}.create-room{grid-template-columns:minmax(260px,.86fr) minmax(320px,1.14fr);align-items:start;gap:22px;display:grid}.create-room p,.panel-head p,.teacher-panel p,.student-panel p{color:var(--muted);margin-top:6px;line-height:1.5}.tip-grid{gap:8px;margin-top:18px;display:grid}.tip-grid span{border:1px solid var(--line);color:#344054;background:#ffffffa3;border-radius:16px;padding:10px 12px;font-weight:800}.create-form,.model-form{gap:12px;display:grid}.create-form label{color:#344054;gap:7px;font-size:13px;font-weight:900;display:grid}.student-welcome{grid-template-columns:minmax(260px,.9fr) minmax(320px,1.1fr);align-items:stretch;gap:22px;display:grid}.student-welcome p{color:var(--muted);margin-top:8px;line-height:1.55}.student-guide-grid{grid-template-columns:repeat(3,1fr);gap:12px;display:grid}.student-guide-grid article{background:#ffffffa8;border:1px solid #635bff24;border-radius:20px;align-content:start;gap:10px;padding:16px;display:grid}.student-guide-grid strong{background:linear-gradient(135deg, var(--accent), var(--accent-dark));color:#fff;border-radius:14px;place-items:center;width:38px;height:38px;display:grid;box-shadow:0 10px 20px #4f46e533}.student-guide-grid span{color:#344054;font-weight:850;line-height:1.4}.workspace-grid{grid-template-columns:minmax(300px,.9fr) minmax(390px,1fr) minmax(430px,1.1fr);align-items:start;gap:16px;display:grid}.student-panel,.teacher-panel,.results-panel{min-width:0}.panel-head{justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:16px;display:flex}.label-row{flex-wrap:wrap;gap:8px;margin-bottom:16px;display:flex}.label-row span{color:#4c1d95;background:#f5f3ff;border:1px solid #635bff24;border-radius:999px;padding:7px 11px;font-weight:900}.submission-list{gap:10px;margin-top:16px;display:grid}.submission-card{background:#ffffffad;border:1px solid #19233c1a;border-radius:18px;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:10px;padding:12px;display:grid}.submission-card strong,.submission-card span{text-overflow:ellipsis;white-space:nowrap;display:block;overflow:hidden}.submission-card span{color:var(--muted);margin-top:4px;font-size:12px}.submission-card button,.photo-card button{min-height:36px;box-shadow:none;color:var(--danger);background:#fff;border:1px solid #d92d2038;padding:0 11px}.drop-zone{min-height:118px;color:var(--muted);cursor:pointer;text-align:center;background:radial-gradient(circle at 50% 0,#635bff17,#0000 56%),#ffffff9e;border:2px dashed #635bff52;border-radius:22px;place-items:center;margin-bottom:14px;display:grid}.drop-zone strong{color:var(--accent-dark);font-size:17px}.drop-zone span{margin-top:3px;font-size:13px;font-weight:700}.drop-zone input{display:none}.photo-grid{grid-template-columns:repeat(auto-fill,minmax(145px,1fr));gap:12px;display:grid}.photo-card{background:#ffffffad;border:1px solid #19233c1a;border-radius:20px;gap:8px;padding:9px;display:grid}.photo-card img{aspect-ratio:1;object-fit:cover;background:#edf1f7;border-radius:16px;width:100%}.photo-card input,.photo-card select{border-radius:12px;min-height:40px;padding:8px}.score-button{background:linear-gradient(135deg,#f97316,#dc2626);width:100%;min-height:54px;margin-top:16px;box-shadow:0 14px 30px #f973163d}.empty{color:var(--muted);text-align:center;background:#ffffff80;border:1px dashed #19233c24;border-radius:18px;padding:18px;line-height:1.5}.table-wrap{background:#ffffffbd;border:1px solid #19233c1a;border-radius:20px;overflow-x:auto}table{border-collapse:collapse;width:100%;min-width:720px}th,td{text-align:left;vertical-align:top;border-bottom:1px solid #19233c14;padding:14px 13px}th{color:var(--muted);text-transform:uppercase;font-size:12px}tbody tr:last-child td{border-bottom:0}.rank-badge{width:34px;height:34px;color:var(--accent-dark);background:#eef2ff;border-radius:12px;place-items:center;font-weight:950;display:inline-grid}tbody tr:first-child .rank-badge{color:#5f370e;background:linear-gradient(135deg,#facc15,#fb923c)}tbody tr:first-child td:nth-child(3){color:var(--success);font-weight:950}.setup-warning{margin-top:12vh}.setup-warning p{color:var(--muted);margin-top:10px}pre{border:1px solid var(--line);background:#ffffffb3;border-radius:18px;margin:16px 0 0;padding:14px;overflow-x:auto}@media (max-width:1180px){.hero,.workspace-grid{grid-template-columns:1fr 1fr}.hero-copy,.results-panel{grid-column:1/-1}}@media (max-width:760px){.app-shell{width:min(100% - 18px,1440px);padding-top:12px}.hero,.control-band,.create-room,.student-welcome,.student-guide-grid,.workspace-grid{grid-template-columns:1fr}.hero-copy,.hero-card,.panel{border-radius:24px}.hero-actions,.control-band{flex-direction:column;align-items:stretch}.join-form{grid-template-columns:1fr;width:100%}.status-pill{justify-content:center}.results-panel{grid-column:auto}.room-code,.room-meta{justify-content:space-between;width:100%}.room-meta{flex-wrap:wrap}}.instant-photo-card{background:#ffffffad;border:1px solid #19233c1a;border-radius:22px;grid-template-columns:minmax(140px,.8fr) minmax(180px,1.2fr);align-items:stretch;gap:14px;padding:10px;display:grid}.instant-photo-card img{aspect-ratio:1;object-fit:cover;background:#edf1f7;border-radius:18px;width:100%;min-height:190px}.instant-photo-form{align-content:start;gap:10px;display:grid}.instant-photo-form label{color:#344054;gap:7px;font-size:13px;font-weight:900;display:grid}.instant-photo-form button{min-height:42px;box-shadow:none;color:var(--accent-dark);background:#fff;border:1px solid #635bff2e}.judgement-pill{color:#b42318;background:#fef3f2;border-radius:999px;align-items:center;margin-right:8px;padding:5px 9px;font-size:12px;font-weight:950;display:inline-flex}.judgement-pill.correct{color:#067647;background:#ecfdf3}.prediction-text{color:#344054;font-size:13px;font-weight:750}@media (max-width:760px){.instant-photo-card{grid-template-columns:1fr}}.model-link-row{grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:10px;display:grid}.tm-link-button{min-height:48px;color:var(--accent-dark);white-space:nowrap;background:#fff;border:1px solid #635bff2e;border-radius:16px;justify-content:center;align-items:center;padding:0 14px;font-size:14px;font-weight:950;text-decoration:none;transition:transform .18s,box-shadow .18s,border-color .18s;display:inline-flex;box-shadow:0 10px 20px #4f46e514}.tm-link-button:hover{border-color:#635bff6b;transform:translateY(-1px);box-shadow:0 14px 26px #4f46e524}@media (max-width:760px){.model-link-row{grid-template-columns:1fr}}.workspace-grid.student-workspace{grid-template-columns:minmax(340px,.95fr) minmax(430px,1.05fr)}.workspace-grid.student-workspace .results-panel{grid-column:auto}@media (max-width:1180px){.workspace-grid.student-workspace{grid-template-columns:1fr}}.room-list-panel{margin-bottom:16px}.room-card-grid{grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:12px;display:grid}.room-card{min-height:132px;color:var(--ink);text-align:left;box-shadow:var(--shadow-soft);background:radial-gradient(circle at 100% 0,#635bff1c,#0000 42%),#ffffffb8;border:1px solid #635bff29;border-radius:22px;gap:8px;padding:16px;display:grid}.room-card span{width:fit-content;color:var(--accent-dark);letter-spacing:.08em;background:#eef2ff;border-radius:999px;padding:5px 9px;font-size:12px;font-weight:950}.room-card strong{letter-spacing:-.02em;font-size:18px}.room-card small{color:var(--muted);font-size:13px;font-weight:750;line-height:1.35}.ghost-button{min-height:42px;box-shadow:none;color:var(--accent-dark);background:#fff;border:1px solid #635bff2e;padding:0 14px}.submission-list-wrap{gap:10px;margin-top:16px;display:grid}.selection-actions{background:#ffffff9e;border:1px solid #635bff24;border-radius:18px;flex-wrap:wrap;align-items:center;gap:8px;padding:10px;display:flex}.selection-actions span{color:var(--accent-dark);margin-right:auto;font-size:13px;font-weight:950}.selection-actions button{min-height:34px;box-shadow:none;color:var(--accent-dark);background:#fff;border:1px solid #635bff2e;padding:0 10px;font-size:13px}.submission-card.selected{background:#eef2ffd1;border-color:#635bff6b}.select-model-check{color:var(--accent-dark);white-space:nowrap;align-items:center;gap:6px;font-size:13px;font-weight:900;display:inline-flex}.select-model-check input{width:18px;min-height:18px;accent-color:var(--accent)}
