:root{color-scheme:light;--navy:#1b3441;--navy2:#163c4b;--teal:#0b817b;--amber:#e3a34c;--coral:#bd5b42;--paper:#fbf8f1;--ink:#24394a;--muted:#5e7077;--border:#d6dedc;--white:#fff}*{box-sizing:border-box}html{scroll-behavior:smooth}body{font-family:system-ui,-apple-system,'Segoe UI',sans-serif;margin:0;color:var(--ink);background:#f7f8f5;line-height:1.55}button,input,select{font:inherit}button{cursor:pointer}button:focus-visible,input:focus-visible,select:focus-visible,a:focus-visible{outline:3px solid #ffab41;outline-offset:2px}a{color:inherit}.skip{position:absolute;top:-80px;left:10px;background:#fff;padding:10px;z-index:300}.skip:focus{top:10px}.topbar{background:#fff;min-height:76px;padding:12px clamp(20px,5vw,85px);display:flex;justify-content:space-between;gap:15px;align-items:center;border-bottom:1px solid var(--border);position:sticky;top:0;z-index:50}.logo{text-decoration:none;display:flex;align-items:center;gap:10px;font-weight:900;font-size:17px;letter-spacing:.06em;line-height:1.08}.logo strong{color:var(--teal)}.logo small{display:block;font-size:9px;letter-spacing:.26em;color:var(--muted);margin-top:6px}.logo-mark{background:var(--navy2);border-radius:15px;color:white;display:grid;place-items:center;font-size:32px;width:50px;height:50px;transform:rotate(-8deg)}.top-actions{display:flex;align-items:center;gap:8px}.top-actions select,.nav-btn{background:#fff;border:1px solid var(--border);padding:9px 12px;border-radius:9px;text-decoration:none;font-size:13px;color:var(--ink)}.hero{background:var(--navy2);display:grid;grid-template-columns:1.05fr .95fr;gap:30px;align-items:center;color:white;padding:clamp(38px,6vw,85px) clamp(20px,7vw,110px);overflow:hidden}.eyebrow{font-size:12px;letter-spacing:.18em;font-weight:900;text-transform:uppercase;color:#b66a43}.hero .eyebrow{color:#edd19c}.hero h1{font-family:Georgia,serif;font-size:clamp(36px,5vw,64px);line-height:1.08;letter-spacing:-.032em;max-width:800px;margin:18px 0}.hero p{color:#e2e9e7;font-size:clamp(16px,1.6vw,19px);max-width:650px}.hero-cta{display:flex;gap:10px;flex-wrap:wrap;margin-top:25px}.primary,.secondary,.complete-btn{padding:12px 17px;border-radius:9px;font-weight:800;border:1px solid transparent}.primary{background:#e6ac55;color:#20323a}.primary:hover{background:#f4c16e}.secondary{background:white;color:var(--navy);border-color:var(--border)}.secondary:hover{background:#e9efed}.sample-frame{background:#fff;border:10px solid #fff;transform:rotate(3deg);border-radius:7px;box-shadow:18px 22px 0 rgba(0,0,0,.13);max-width:520px}.sample-frame img{width:100%;height:auto}.hero-art{position:relative;padding:12px 30px 15px 4px}.float-tag{position:absolute;background:#efc36f;color:#24394a;bottom:-16px;right:4%;padding:12px 20px;font-size:24px;font-weight:900;transform:rotate(-7deg);box-shadow:5px 9px 0 #16363e}.float-tag span{font-size:13px}.dashboard,.catalogue,.workshop,.footer-note{max-width:1420px;margin:auto;padding:30px clamp(17px,4vw,58px)}.dashboard{display:grid;grid-template-columns:1fr 1.5fr;gap:18px}.dash-card{padding:24px;background:#fff;border:1px solid var(--border);border-radius:14px;box-shadow:0 3px 15px #19364508}.dash-card>span{display:block;font-size:14px;font-weight:800;color:var(--muted)}.dash-card strong{display:block;font-size:32px;margin:7px 0}.dash-guide label{display:block;font-size:14px;margin:6px 0 9px}.lookup{display:flex;gap:7px}.lookup input{width:200px;max-width:60%;padding:10px;border:1px solid #acbfbd;border-radius:8px;text-transform:uppercase}.error{font-size:13px;color:#b03224;margin:6px 0 0;min-height:20px}.progress-track{height:11px;background:#e8eeeb;border-radius:20px;overflow:hidden}.progress-track div{background:var(--teal);height:100%;width:0%;transition:width .3s}.section-head{display:flex;align-items:end;justify-content:space-between;gap:25px;margin-bottom:24px}.section-head h2,.lesson-heading h2{font-family:Georgia,serif;font-size:clamp(30px,3.2vw,45px);margin:6px 0}.section-head p{max-width:710px;color:var(--muted);margin:0}.filters{display:flex;gap:6px;flex-wrap:wrap}.chip{border:1px solid #bacac6;border-radius:30px;padding:9px 17px;background:#fff;color:var(--ink);font-weight:750}.chip.active{background:var(--navy2);color:#fff}.cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:15px}.lesson-card{border:1px solid var(--border);background:#fff;text-align:left;border-radius:13px;overflow:hidden;display:flex;flex-direction:column;padding:0;transition:transform .15s,box-shadow .15s;min-width:0}.lesson-card:hover{transform:translateY(-3px);box-shadow:0 12px 25px #203b4a20}.card-image{display:grid;place-items:center;aspect-ratio:1.4;background:#fcfcfa;padding:9px}.card-image img{max-width:100%;height:100%;width:100%;object-fit:contain}.card-text{padding:14px;flex:1}.card-meta{display:flex;justify-content:space-between;gap:8px;color:#63747e;font-weight:800;font-size:11px;letter-spacing:.06em}.card-text h3{font-family:Georgia,serif;line-height:1.2;margin:8px 0 6px;font-size:19px}.card-text p{font-size:13px;color:var(--muted);margin:0}.card-foot{border-top:1px solid #edf0ec;padding:10px 14px;display:flex;justify-content:space-between;align-items:center;font-size:13px;font-weight:850}.done-icon{color:#0b817b}.hidden{display:none!important}.workshop{padding-top:20px}.workshop-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}.text-btn{border:0;background:transparent;color:var(--teal);font-weight:800}.lesson-id{padding:6px 12px;border-radius:8px;background:#dfece9;font-weight:900;letter-spacing:.1em}.lesson-heading{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-bottom:21px}.lesson-heading p{margin:0;max-width:820px;color:var(--muted)}.complete-btn{background:#e6efed;color:#1f5b55;border-color:#b2d3cb;white-space:nowrap}.complete-btn.completed{background:#16766e;color:white}.work-grid{display:grid;grid-template-columns:minmax(285px,.38fr) minmax(440px,.62fr);gap:20px;align-items:start}.guide,.studio{background:#fff;border:1px solid var(--border);border-radius:14px;padding:20px;box-shadow:0 5px 18px #19364509;min-width:0}.guide-header,.studio-header{display:flex;justify-content:space-between;align-items:center;gap:12px}.guide-header h3,.studio-header h3{margin:0;font-family:Georgia,serif;font-size:23px}.guide-header span{font-weight:900;color:var(--teal)}.guide-image{border:1px solid #dbe3e1;background:#fff;aspect-ratio:600/360;margin-top:15px}.guide-image img{width:100%;height:100%;object-fit:contain}.guide>p{color:#485c63;font-size:14px}.stage-buttons{display:flex;align-items:center;justify-content:space-between;gap:8px}.stage-buttons button{padding:7px 15px}.step-pips{display:flex;gap:6px}.step-pips button{width:30px;height:30px;border-radius:30px;border:1px solid #a6bbb9;background:white;color:var(--ink);font-weight:900}.step-pips button.active{background:var(--teal);color:#fff;border-color:var(--teal)}.tips{background:#eef6f2;padding:15px;border-radius:10px;margin-top:22px}.tips h4,.challenge h4{font-size:16px;margin:0 0 10px}.tips ol{padding-left:20px;margin:0;font-size:14px}.tips li{margin:6px 0}.challenge{border-top:1px solid var(--border);padding-top:17px;margin-top:20px;font-size:14px}.challenge h4{margin-top:17px}.challenge details{border:1px solid #d5e3e0;border-radius:7px;padding:10px;margin-top:8px}.challenge summary{cursor:pointer;font-weight:800}.studio-header{margin-bottom:15px}.local-badge{font-size:11px;color:#52676b;max-width:190px;text-align:right}.toolbar{display:flex;flex-wrap:wrap;gap:7px;margin-bottom:12px}.tool{border:1px solid var(--border);padding:8px 10px;background:white;color:var(--ink);border-radius:8px;font-size:14px;font-weight:750}.tool.active{color:#fff;background:var(--navy2);border-color:var(--navy2)}.extras{background:#f4f7f6;padding:9px 12px;align-items:center;border-radius:9px}.extras label{display:flex;gap:6px;align-items:center;font-size:12px;font-weight:800;color:#384d55}.extras input[type=range]{width:80px;accent-color:var(--teal)}.extras input[type=color]{height:29px;width:38px;border:0;background:transparent}.extras input[type=checkbox]{accent-color:var(--teal)}.board-wrap{position:relative;background:#fff;border:2px solid #c6d4d1;border-radius:6px;overflow:hidden;touch-action:none;isolation:isolate;aspect-ratio:900/560}.board-wrap.gridded{background-image:linear-gradient(#e1e8e9 1px,transparent 1px),linear-gradient(90deg,#e1e8e9 1px,transparent 1px);background-size:24px 24px}.board-wrap #ghost{inset:0;position:absolute;background-position:center;background-size:contain;background-repeat:no-repeat;opacity:.16;pointer-events:none}.board-wrap canvas{width:100%;height:100%;display:block;position:relative;touch-action:none;cursor:crosshair}.board-actions{display:flex;flex-wrap:wrap;gap:8px;justify-content:flex-end;margin-top:13px}.board-actions button{padding:9px 14px;font-size:13px}.studio-help{font-size:12px;color:var(--muted);margin-bottom:0}.footer-note{border-top:1px solid #dce4e0;color:#53686e}.footer-note strong{font-family:Georgia,serif;color:var(--navy2);font-size:21px}.footer-note p{max-width:900px}footer{background:var(--navy2);color:#d5e5e3;padding:25px clamp(17px,4vw,58px);font-size:12px}@media(max-width:1120px){.cards{grid-template-columns:repeat(3,minmax(0,1fr))}.work-grid{grid-template-columns:minmax(0,1fr)}.guide{display:grid;grid-template-columns:.8fr 1.2fr;column-gap:20px}.guide-header{grid-column:1/3}.guide-image,.guide>p,.stage-buttons{grid-column:1}.tips,.challenge{grid-column:2}.tips{grid-row:2/4;margin-top:15px}.challenge{grid-row:4/6}}@media(max-width:730px){.topbar{padding:8px 14px}.logo{font-size:12px}.logo-mark{height:38px;width:38px;font-size:24px}.top-actions{gap:4px}.top-actions select,.nav-btn{padding:7px 5px;font-size:11px}.hero{grid-template-columns:1fr;padding:38px 20px 46px}.hero-art{max-width:400px;padding:8px 15px 20px}.dashboard{grid-template-columns:1fr}.section-head{display:block}.filters{margin-top:18px}.cards{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.card-text{padding:11px}.card-text h3{font-size:17px}.card-meta{font-size:10px}.lesson-heading{align-items:flex-start;flex-direction:column}.guide{display:block}.guide .tips{margin-top:16px}.board-actions{justify-content:start}.tool{font-size:12px}.tool span{display:none}.local-badge{display:none}.studio,.guide{padding:12px}.workshop{padding:12px}.hero h1{font-size:40px}}@media(max-width:440px){.cards{grid-template-columns:1fr 1fr}.card-image{aspect-ratio:1.3}.card-text p{display:none}.card-meta{font-size:9px}.card-text h3{font-size:15px}.card-foot{font-size:11px;padding:9px}.hero h1{font-size:36px}.logo small{font-size:7px}}
