.feature-intro{margin-bottom:28px}.feature-intro h1{font-size:31px}.feature-intro p{font-size:15px;color:var(--muted);margin:10px 0}.opponents{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-bottom:26px}.opponent-card{padding:22px 18px;text-align:left;background:#fdfdf9;border:1px solid var(--border);border-radius:12px;position:relative;min-width:0}.opponent-card.active{border:2px solid var(--green);padding:21px 17px;background:#edf2e7}.opponent-card.active:after{content:'✓';position:absolute;right:15px;top:15px;color:var(--green)}.opponent-mark{display:grid;place-items:center;width:52px;height:52px;border-radius:50%;color:#f5f1df;font-size:27px;font-family:serif;margin-bottom:15px}.opponent-card strong{display:block;font-size:19px;margin-bottom:8px}.opponent-card p{font-size:14px;color:#646e60;line-height:1.8;margin:14px 0}.opponent-card small{font-size:12px;color:var(--muted)}.panel{padding:25px;background:#fdfdf9;border:1px solid var(--border);border-radius:12px}.match-layout{display:grid;grid-template-columns:1.2fr 1fr;gap:24px;align-items:start}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px 16px;margin:24px 0}.form-grid label,.teacher-controls label{font-size:14px;display:grid;gap:8px;color:#5b6557}.form-grid select,.form-grid input,.teacher-controls select{width:100%;min-width:0;height:44px;padding:8px 10px;background:white;border:1px solid var(--border);border-radius:6px;font-size:14px;color:var(--ink)}.help-text{font-size:13px;color:var(--muted);line-height:1.9}.connection-banner{padding:18px;background:#f0f2e9;border-left:3px solid #acb89b;border-radius:0 7px 7px 0;margin:24px 0}.connection-banner strong{font-size:15px;font-weight:500}.connection-banner p{font-size:13px;line-height:1.9;color:#707865;margin:8px 0 0}.mini-board{max-width:380px;margin:22px auto}.mini-board svg{display:block;width:100%;height:auto;border:5px solid #d2a15f;border-radius:10px}.quote-label{text-align:center;color:#859078;font-size:12px}.match-preview blockquote{font-size:16px;line-height:1.9;text-align:center;margin:12px 5px 24px;color:var(--green)}.chat-preview{padding-top:20px;border-top:1px solid var(--border)}.chat-preview label,.question-label{display:block;font-size:14px;margin-bottom:10px}.chat-preview textarea{width:100%;resize:vertical;padding:12px;border-radius:7px;border:1px solid var(--border);font:inherit;font-size:14px;background:white}.chat-preview small{font-size:12px;color:var(--muted)}.teacher-preferences{margin-bottom:24px}.teacher-controls{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:22px}.teacher-preferences h2{font-size:21px;margin-top:5px}.question-row{display:flex;gap:10px}.question-row input{min-width:0;flex:1;padding:12px;border:1px solid var(--border);border-radius:7px;font:inherit;font-size:14px}.photo-steps{display:flex;gap:26px;padding-bottom:20px;border-bottom:1px solid var(--border);margin-bottom:25px;flex-wrap:wrap}.photo-steps span{font-size:13px;color:#818a77}.photo-steps span.active{color:var(--green);font-weight:600}.photo-layout{display:grid;grid-template-columns:1.5fr 1fr;gap:22px;align-items:start}.photo-stage{min-width:0}.photo-empty{min-height:350px;display:flex;align-items:center;justify-content:center;flex-direction:column;text-align:center;border:1px dashed #cbd4bd;border-radius:9px;background:#f4f6ed;padding:28px 15px;margin-top:22px}.photo-empty>span{font-size:55px;line-height:1;color:#859b72}.photo-empty h3{font-size:16px;line-height:1.7;margin:20px 0 8px;font-weight:500}.photo-empty p{font-size:13px;color:var(--muted);line-height:1.9;margin-bottom:25px}#photoCanvas{width:100%;height:auto;display:block;margin-top:22px;border-radius:6px;cursor:crosshair;touch-action:manipulation}.corner-guide{font-size:14px;color:var(--green);padding:12px;background:#eef3e6;border-radius:6px}.recognition-options{margin:20px 0;font-size:14px}.recognition-options summary{cursor:pointer;color:var(--green)}.recognition-options label{display:grid;gap:8px;margin:15px 0;font-size:13px}.recognition-options input{width:100%;accent-color:var(--green)}.photo-settings .form-grid{gap:15px}.photo-settings .button{margin-top:10px}.photo-settings .connection-banner{margin-bottom:15px}
@media(max-width:1180px){.opponents{gap:10px}.opponent-card{padding:16px 12px}.opponent-card.active{padding:15px 11px}.opponent-card strong{font-size:17px}.opponent-card p{font-size:13px}.match-layout,.photo-layout{gap:16px}.panel{padding:20px}.match-layout{grid-template-columns:1.1fr 1fr}.form-grid{gap:15px 10px}}
@media(max-width:900px){nav{flex-wrap:wrap;gap:3px 20px}.nav-item{font-size:13px}.photo-layout{grid-template-columns:1fr 1fr}.opponent-card small{display:none}}
@media(max-width:680px){nav{display:grid;grid-template-columns:repeat(3,1fr);gap:0 8px}.nav-item{justify-content:center;padding:9px 0;font-size:13px}.feature-intro h1{font-size:25px}.feature-intro p{font-size:13px}.opponents{grid-template-columns:1fr 1fr;gap:10px}.opponent-card strong{font-size:18px}.opponent-card p{font-size:13px;margin-bottom:0}.opponent-mark{width:43px;height:43px;font-size:23px}.match-layout,.photo-layout{grid-template-columns:1fr}.match-settings .section-title{align-items:flex-start;gap:8px;flex-direction:column}.form-grid{gap:18px 12px}.form-grid select,.teacher-controls select{font-size:13px}.photo-steps{gap:12px 22px}.photo-steps span{font-size:12px}.photo-empty{min-height:300px}.teacher-preferences .section-title{align-items:flex-start;gap:10px}.teacher-preferences .tag{font-size:11px}.teacher-controls{gap:12px}.question-row{flex-wrap:wrap}.question-row input{width:100%;flex-basis:100%}.question-row button{width:100%}.teacher-preferences h2{font-size:18px}.panel{padding:18px}}
