.projects-page{--ink:#1d2527;--ink-soft:#556063;--paper:#f2f0ea;--paper-2:#e9e6de;--surface:#f8f7f3;--line:#d6d2c8;--petrol:#2f5c60;--petrol-soft:#dfe9e7;--gold:#755528;--ok:#3f6b58;--error:#8a4b45;--focus:#1d6a70;--shadow:0 22px 60px rgba(33,43,44,.09);background:var(--paper);color:var(--ink)}
.projects-page :where(a,button,input,select,textarea,[tabindex]):focus-visible{outline-color:var(--focus)}
.projects-hero{max-width:1460px;margin:auto;padding:78px 28px 48px;display:grid;grid-template-columns:minmax(0,1.25fr) minmax(300px,.75fr);gap:64px;align-items:end}
.projects-hero h1{font:500 clamp(52px,7vw,96px)/.92 var(--display);letter-spacing:-.045em;margin:17px 0 24px}
.projects-hero>div>p{max-width:800px;margin:0;color:var(--ink-soft);font:400 clamp(20px,2.1vw,29px)/1.35 var(--display)}
.projects-scale{border-left:1px solid var(--gold);padding:8px 0 8px 25px;display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.projects-scale div{min-width:0}
.projects-scale strong{display:block;font:600 38px/1 var(--display);color:var(--ink)}
.projects-scale span{display:block;margin-top:4px;color:var(--ink-soft);font-size:10px;letter-spacing:.08em;text-transform:uppercase}
.projects-scale p{grid-column:1/-1;margin:9px 0 0;padding-top:13px;border-top:1px solid var(--line);color:var(--ink-soft);font-size:11px}

.graduation-guide{max-width:1404px;margin:0 auto 28px;border:1px solid #bdc9c5;border-radius:22px;background:linear-gradient(145deg,#e7eeeb,#f7f5ef);padding:30px 34px}
.graduation-guide header{display:grid;grid-template-columns:minmax(280px,.7fr) minmax(420px,1.3fr);gap:7px 50px;align-items:end}
.graduation-guide header .kicker{grid-column:1/-1}
.graduation-guide h2{font:550 clamp(30px,3.5vw,48px)/1.03 var(--display);margin:0}
.graduation-guide header p{color:var(--ink-soft);margin:0 0 4px;max-width:630px}
.graduation-guide ol{list-style:none;padding:0;margin:27px 0 0;display:grid;grid-template-columns:repeat(5,1fr);gap:8px}
.graduation-guide li{min-height:125px;border:1px solid rgba(47,92,96,.18);border-radius:13px;background:rgba(255,255,255,.58);padding:13px;display:flex;flex-direction:column}
.graduation-guide li span{color:var(--gold);font:600 20px var(--display)}
.graduation-guide li strong{font:600 21px var(--display);margin-top:auto}
.graduation-guide li small{color:var(--ink-soft);line-height:1.35;margin-top:3px}

.projects-controls{max-width:1404px;margin:0 auto 15px;border:1px solid var(--line);border-radius:15px;background:rgba(248,247,243,.78);padding:12px 14px;display:flex;flex-wrap:wrap;align-items:center;gap:12px;box-shadow:0 12px 35px rgba(33,43,44,.04)}
.level-controls{display:flex;gap:6px}
.level-controls button{min-height:44px;border:1px solid var(--line);border-radius:10px;background:#fff;color:var(--ink-soft);padding:9px 14px;cursor:pointer;font-weight:700}
.level-controls button[aria-pressed=true]{background:var(--petrol);border-color:var(--petrol);color:#fff}
.projects-controls label{margin-left:auto;display:flex;align-items:center;gap:8px;color:var(--ink-soft);font-size:12px;font-weight:700}
.projects-controls select{min-height:42px;border:1px solid var(--line);border-radius:9px;background:#fff;color:var(--ink);padding:8px 32px 8px 10px}
.projects-controls>p{width:min(310px,30vw);margin:0;color:var(--ink-soft);font-size:11px;line-height:1.35}
.project-reset{min-height:42px;border:1px solid #bbb7ad;border-radius:9px;background:transparent;color:var(--ink-soft);padding:8px 11px;cursor:pointer;font-size:11px;font-weight:750}
.storage-notice{flex-basis:100%;width:auto!important;border-left:2px solid var(--gold);padding-left:9px}

.projects-shell{max-width:1460px;margin:0 auto 72px;padding:0 28px;display:grid;grid-template-columns:245px minmax(520px,1fr) 285px;gap:16px;align-items:start}
.project-list-panel,.project-workspace,.project-teacher{border:1px solid var(--line);border-radius:18px;background:rgba(248,247,243,.78)}
.project-list-panel,.project-teacher{position:sticky;top:90px;padding:17px;max-height:calc(100vh - 108px);overflow:auto}
.project-list{display:grid;gap:7px}
.project-list button{width:100%;min-height:62px;border:1px solid transparent;border-radius:11px;background:transparent;color:var(--ink-soft);padding:10px;text-align:left;cursor:pointer;display:grid;grid-template-columns:26px 1fr;gap:9px;align-items:start}
.project-list button:hover{background:var(--paper-2)}
.project-list button[aria-current=true]{background:var(--petrol);color:#fff}
.project-list .project-number{width:25px;height:25px;border:1px solid currentColor;border-radius:50%;display:grid;place-items:center;font:600 12px var(--display);opacity:.74}
.project-list strong{display:block;color:inherit;font-size:12px;line-height:1.35}
.project-list small{display:block;margin-top:3px;opacity:.72;font-size:9px;text-transform:uppercase;letter-spacing:.06em}
.project-list .is-complete .project-number{background:var(--ok);border-color:var(--ok);color:#fff;opacity:1}

.project-workspace{min-height:640px;padding:clamp(25px,4vw,48px);box-shadow:0 12px 42px rgba(33,43,44,.05)}
.project-welcome{min-height:520px;display:grid;place-content:center;max-width:650px;margin:auto;text-align:center}
.project-welcome h2{font:550 clamp(36px,5vw,58px)/1 var(--display);margin:12px 0 16px}
.project-welcome p{color:var(--ink-soft);margin:0}
.project-overview .project-level,.project-task .task-grade{display:inline-flex;align-items:center;min-height:28px;border:1px solid #b5c7c2;border-radius:999px;padding:4px 9px;color:var(--petrol);font-size:10px;font-weight:750;letter-spacing:.06em;text-transform:uppercase}
.project-overview h2{font:550 clamp(39px,5vw,62px)/.98 var(--display);letter-spacing:-.025em;margin:14px 0 14px}
.project-overview .project-summary{font:400 21px/1.4 var(--display);color:var(--ink-soft);margin:0 0 24px}
.project-facts{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin:20px 0}
.project-facts div{border:1px solid var(--line);border-radius:11px;background:var(--paper);padding:12px}
.project-facts span{display:block;color:var(--ink-soft);font-size:9px;font-weight:750;letter-spacing:.09em;text-transform:uppercase}
.project-facts strong{display:block;margin-top:4px;font-size:12px;line-height:1.45}
.project-actions,.task-actions,.project-result-actions{display:flex;flex-wrap:wrap;gap:9px;margin-top:22px}
.project-primary,.project-secondary,.project-quiet{min-height:44px;border-radius:10px;padding:11px 16px;cursor:pointer;font-weight:750;font-size:13px}
.project-primary{border:1px solid var(--petrol);background:var(--petrol);color:#fff}
.project-primary:hover{background:#244c50}
.project-secondary{border:1px solid #bbb7ad;background:#fff;color:var(--ink)}
.project-quiet{border:0;background:transparent;color:var(--petrol)}
.project-primary:disabled,.project-secondary:disabled{opacity:.48;cursor:not-allowed}

.task-progress{display:flex;justify-content:space-between;align-items:center;gap:15px;color:var(--ink-soft);font-size:11px}
.task-progress-track{height:4px;margin:8px 0 24px;border-radius:8px;background:var(--paper-2);overflow:hidden}
.task-progress-fill{display:block;height:100%;background:var(--petrol);transition:width .25s}
.task-step-nav{display:grid;grid-template-columns:repeat(5,1fr);gap:6px;margin:0 0 22px}
.task-step-nav button{min-height:42px;border:1px solid var(--line);border-radius:9px;background:#fff;color:var(--ink-soft);cursor:pointer;font-size:11px;font-weight:750}
.task-step-nav button[aria-current=step]{border-color:var(--petrol);background:var(--petrol);color:#fff}
.task-step-nav button.is-worked:not([aria-current=step]){border-color:#9eb9ae;background:#e3ece6;color:#294b3b}
.project-task .task-grade{margin-bottom:10px}
.project-task .task-grade.grade-4,.project-task .task-grade.grade-5{border-color:#c8b180;color:var(--gold)}
.project-task h2{font:550 clamp(29px,4vw,42px)/1.14 var(--display);margin:8px 0 22px}
.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
.guided-support{border-left:3px solid var(--gold);border-radius:0 11px 11px 0;background:#f2ecdf;padding:13px 15px;margin:0 0 18px;color:var(--ink-soft);font-size:13px}
.guided-support strong{display:block;color:var(--ink);margin-bottom:3px}
.project-options{display:grid;gap:9px;border:0;margin:0;padding:0;min-width:0}
.project-option{display:grid;grid-template-columns:22px 1fr;gap:9px;align-items:start;border:1px solid #c6c1b7;border-radius:12px;background:#fff;padding:13px;cursor:pointer}
.project-option:has(input:checked){border-color:var(--petrol);background:var(--petrol-soft)}
.project-option input{margin-top:4px;accent-color:var(--petrol)}
.project-answer{width:100%;border:1px solid #bbb6ac;border-radius:12px;background:#fff;color:var(--ink);padding:14px 15px}
textarea.project-answer{min-height:125px;resize:vertical}
.project-feedback{display:none;border-radius:12px;padding:14px 16px;margin-top:15px;font-size:13px}
.project-feedback.visible{display:block}
.project-feedback strong{display:block;margin-bottom:4px}
.project-feedback.correct{background:#e3ece6;color:#294b3b}
.project-feedback.review{background:#f1e4e1;color:#6f3832}
.project-feedback.reference{background:#f3ead6;color:#42351f;border:1px solid #d8c28f}
.self-review{display:grid;gap:8px;margin-top:14px}
.self-review label{display:grid;grid-template-columns:22px 1fr;gap:8px;border:1px solid var(--line);border-radius:9px;background:#fff;padding:10px;color:var(--ink-soft);font-size:12px}
.self-review input{margin-top:3px;accent-color:var(--petrol)}
.review-fields{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin:13px 0}
.review-fields label{display:grid;gap:5px;color:var(--ink);font-size:11px;font-weight:750}
.review-fields input,.review-fields textarea{width:100%;min-height:44px;border:1px solid #aaa59a;border-radius:9px;background:#fff;color:var(--ink);padding:10px;font:inherit;font-weight:400}
.review-fields textarea{min-height:72px;resize:vertical}
.review-status{display:inline-flex;margin-top:8px;border:1px solid #b5c7c2;border-radius:999px;padding:4px 8px;color:var(--petrol);font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.05em}

.project-result{text-align:center;max-width:680px;margin:auto}
.project-result .result-mark{width:62px;height:62px;margin:0 auto 15px;border:1px solid var(--petrol);border-radius:50%;display:grid;place-items:center;color:var(--petrol);font:600 30px var(--display)}
.project-result h2{font:550 clamp(38px,5vw,58px)/1 var(--display);margin:0 0 13px}
.project-result>p{color:var(--ink-soft)}
.project-product{margin:22px 0;border:1px solid #c8b180;border-radius:13px;background:#f4eee1;padding:16px;text-align:left}
.project-product strong{display:block;font:600 21px var(--display);margin-bottom:5px}
.project-result-actions{justify-content:center}

.project-teacher h2{font:600 24px var(--display);margin:0 0 7px}
.project-teacher>p{color:var(--ink-soft);font-size:12px}
.teacher-section{border-top:1px solid var(--line);padding-top:12px;margin-top:12px}
.teacher-section>strong,.teacher-principle strong{display:block;color:var(--petrol);font-size:9px;font-weight:800;letter-spacing:.1em;text-transform:uppercase}
.teacher-section p,.teacher-section li,.teacher-principle span{color:var(--ink-soft);font-size:11px;line-height:1.5}
.teacher-section p{margin:5px 0 0}
.teacher-section ul{padding-left:17px;margin:6px 0 0}
.project-rubric{display:grid;gap:6px;margin-top:7px}
.project-rubric div{border:1px solid var(--line);border-radius:8px;background:#fff;padding:8px}
.project-rubric b{display:block;font-size:10px}
.project-rubric span{display:block;color:var(--ink-soft);font-size:9px;line-height:1.35;margin-top:2px}
.teacher-principle{border:1px solid #bdc9c5;border-radius:11px;background:#edf2ef;padding:12px;margin-top:15px}
.teacher-principle span{display:block;margin-top:5px}

.project-principles{max-width:1404px;margin:0 auto 90px;border-top:1px solid var(--line);padding:35px 0 0;display:grid;grid-template-columns:.75fr 1.25fr;gap:28px 60px}
.project-principles h2{font:550 clamp(32px,4vw,48px)/1.05 var(--display);margin:10px 0 0}
.project-principles ul{margin:0;padding-left:20px;color:var(--ink-soft);display:grid;gap:9px}
.sources-note{grid-column:1/-1;margin:0;border-left:2px solid var(--gold);padding-left:15px;color:var(--ink-soft);font-size:11px}
.sources-note a{color:var(--petrol)}
.print-project{display:none}

@media(max-width:1120px){
  .projects-hero{grid-template-columns:1fr;gap:30px}.projects-scale{max-width:700px}
  .projects-shell{grid-template-columns:225px minmax(0,1fr)}.project-teacher{position:static;grid-column:1/-1;max-height:none;display:grid;grid-template-columns:repeat(2,1fr);gap:12px}.project-teacher>h2,.project-teacher>p{grid-column:1/-1}
  .graduation-guide ol{grid-template-columns:repeat(3,1fr)}
}
@media(max-width:760px){
  .projects-hero{padding:48px 18px 30px}.projects-scale{grid-template-columns:repeat(3,1fr);padding-left:16px;gap:9px}.projects-scale strong{font-size:30px}
  .graduation-guide{margin:0 14px 18px;padding:23px 18px}.graduation-guide header{grid-template-columns:1fr}.graduation-guide ol{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:6px}.graduation-guide li{min-width:180px;scroll-snap-align:start}
  .projects-controls{margin:0 14px 12px;align-items:stretch;flex-direction:column}.level-controls{display:grid;grid-template-columns:repeat(3,1fr)}.level-controls button{padding:7px}.projects-controls label{margin:0;justify-content:space-between}.projects-controls>p{width:auto}.review-fields{grid-template-columns:1fr}
  .projects-shell{display:block;padding:0 14px;margin-bottom:55px}.project-list-panel{position:static;max-height:none;margin-bottom:12px}.project-list{display:flex;overflow-x:auto;scroll-snap-type:x mandatory}.project-list button{min-width:205px;scroll-snap-align:start}
  .project-workspace{min-height:0;padding:25px 18px}.project-welcome{min-height:360px}.project-facts{grid-template-columns:1fr}.project-actions,.task-actions,.project-result-actions{display:grid;grid-template-columns:1fr}.project-actions>*,.task-actions>*,.project-result-actions>*{width:100%}
  .project-teacher{display:block;margin-top:12px}.project-principles{margin:0 18px 65px;grid-template-columns:1fr;gap:20px}.sources-note{grid-column:auto}
}
@media(max-width:390px){.projects-scale{grid-template-columns:1fr}.projects-scale p{grid-column:auto}.level-controls{grid-template-columns:1fr}.task-step-nav{grid-template-columns:repeat(3,1fr)}}
@media(prefers-reduced-motion:reduce){.task-progress-fill{transition:none}}

@media print{
  @page{margin:14mm}
  .global-products,.topbar,.projects-hero,.graduation-guide,.projects-controls,.projects-shell,.project-principles,.site-footer{display:none!important}
  body{background:#fff;color:#111;font:11pt/1.45 Arial,sans-serif}
  .print-project{display:block!important}
  .print-project h1{font:700 25pt/1.05 Georgia,serif;margin:0 0 5mm}
  .print-project h2{font:700 16pt Georgia,serif;margin:7mm 0 3mm;break-after:avoid}
  .print-project h3{font:700 12pt Arial,sans-serif;margin:5mm 0 2mm}
  .print-meta{display:flex;gap:8mm;border-bottom:1px solid #999;padding-bottom:3mm;margin-bottom:5mm}
  .print-task{break-inside:avoid;border-top:1px solid #ccc;padding:4mm 0}
  .print-task p{margin:1mm 0}.print-lines{height:24mm;border-bottom:1px dotted #bbb}.print-task-open .print-lines{height:52mm}
  .print-rubric{width:100%;border-collapse:collapse}.print-rubric th,.print-rubric td{border:1px solid #999;padding:2.5mm;text-align:left;font-size:9pt}
}