:root{--winkel-ink:#173f35;--winkel-green:#21654e;--winkel-gold:#efc16e;--winkel-paper:#fff;--winkel-line:#d3e1d8}*{box-sizing:border-box}body.winkel-page{margin:0;background:#f0f5f0;color:var(--winkel-ink);font:18px/1.6 system-ui,sans-serif}.winkel-page [hidden],.winkel-page .hidden{display:none!important}.winkel-page button,.winkel-page input,.winkel-page select{font:inherit}.winkel-page a{color:inherit}.winkel-page button,.winkel-page .primary,.winkel-page .secondary{min-height:48px;border:1px solid #a8c4b3;border-radius:13px;padding:11px 18px;font-weight:750;cursor:pointer;background:white;color:var(--winkel-ink);text-decoration:none;display:inline-flex;align-items:center;justify-content:center;gap:8px}.winkel-page .primary{background:var(--winkel-green);color:#fff;border-color:var(--winkel-green)}.winkel-page .secondary{background:#f5faf5}.winkel-page button:disabled{opacity:.6;cursor:default}.winkel-page :focus-visible{outline:3px solid #bd641b;outline-offset:4px}.winkel-page .topbar{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:22px max(20px,calc((100vw - 1200px)/2));border-bottom:1px solid var(--winkel-line);background:#f8fbf8}.winkel-page .brand{font-weight:900;font-size:24px;text-decoration:none}.winkel-page .topbar nav{display:flex;gap:18px;flex-wrap:wrap;font-size:15px}.winkel-page main{max-width:1240px;margin:0 auto;padding:32px 22px 70px}.winkel-page .eyebrow{font-size:12px;font-weight:850;letter-spacing:.12em;line-height:1.7;color:#53725f}.winkel-page h1{font-size:clamp(32px,4vw,51px);line-height:1.13;letter-spacing:-1.6px;margin:12px 0 22px}.winkel-page h1 em{color:#956326;font-style:normal}.winkel-page h2{font-size:clamp(25px,3vw,34px);line-height:1.25;margin-top:8px}.winkel-page h3{line-height:1.35}.winkel-hero{display:grid;grid-template-columns:2fr 1fr;gap:32px;margin-bottom:32px;align-items:center}.winkel-summary{padding:26px;background:#e0ecdf;border:1px solid #c0d3c3;border-radius:24px}.winkel-summary>b{font-size:42px;display:block}.winkel-summary progress{width:100%;accent-color:var(--winkel-green)}.winkel-page .small,#winkelSave{font-size:14px;color:#587062}.winkel-page .text-button{background:transparent;font-size:14px;padding:8px;border:0;text-decoration:underline}.winkel-layout{display:grid;grid-template-columns:270px minmax(0,1fr);gap:30px}.winkel-layout>nav{align-self:start;position:sticky;top:16px}.winkel-layout nav ol{list-style:none;padding:0;display:grid;gap:8px}.winkel-layout nav button{width:100%;justify-content:flex-start;text-align:left;padding:12px;font-size:15px;line-height:1.35}.winkel-layout nav button[aria-current=step]{background:#e2eedf;border-color:#659679}.winkel-layout nav b{min-width:30px;font-size:20px}.winkel-layout nav small{display:block;font-weight:450;color:#64806d}.winkel-station{background:white;border:1px solid var(--winkel-line);border-radius:24px;padding:clamp(18px,3vw,36px);min-width:0;scroll-margin-top:18px}.winkel-question{margin:26px 0;padding:22px 18px;background:#f7faf6;border:1px solid var(--winkel-line);border-radius:18px}.winkel-question fieldset{border:0;padding:0;min-width:0}.winkel-question legend{font-weight:800;margin-bottom:18px;line-height:1.5}.winkel-options{display:grid;gap:10px;margin:18px 0}.winkel-options label{display:flex;gap:12px;align-items:center;padding:13px;background:#fff;border:1px solid #bbcfbe;border-radius:12px;cursor:pointer}.winkel-options input{min-width:22px;min-height:22px;accent-color:var(--winkel-green)}.winkel-page .feedback{padding:14px;border-radius:12px;background:#e7f3e5;line-height:1.65}.winkel-page .feedback:empty{display:none}.winkel-page .try-again{background:#fff0d2}.winkel-diagram{display:block;width:100%;height:auto;max-height:410px;background:#f5f8ef;border:1px solid #d4e1d4;border-radius:16px;color:#174b3d}.winkel-diagram .ray{stroke:#205642;stroke-width:5;fill:none;stroke-linecap:round}.winkel-diagram .wedge{fill:#e5eddf;stroke:#c5d6c2;stroke-width:1.5}.winkel-diagram .wanted{fill:#edc36d;stroke:#b58d39}.winkel-diagram text{font:23px system-ui,sans-serif;fill:#1b4536}.winkel-diagram .vertex{font-size:18px}.winkel-diagram .guess-ray{stroke:#a84830;stroke-width:5;stroke-dasharray:10 8;fill:none}.winkel-diagram .drag-handle{fill:#fff9;stroke:#a95830;stroke-width:4;cursor:grab;touch-action:none}.winkel-estimate-game{margin:25px 0;border:2px solid #b9d0b6;background:#f9fbf4;border-radius:20px;padding:22px 18px;touch-action:pan-y}.winkel-game-head{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:15px}.estimate-controls,.winkel-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:22px}.game-total{font-size:18px}.game-total b{font-size:31px}.estimate-history{padding-left:24px;font-size:15px}.winkel-page details{padding:16px;border:1px solid #d4e2d5;border-radius:14px;margin:20px 0}.winkel-page summary{font-weight:800;cursor:pointer;min-height:36px}.winkel-page .check-result{padding:20px;background:#e1eedc;border-radius:18px;font-weight:800}.winkel-page footer{text-align:center;font-size:13px;color:#607466;padding:25px}.winkel-page .angle-lab .angle-diagram{max-height:420px}.winkel-page input[type=number],.winkel-page input[type=text],.winkel-page select{min-height:48px;border:1px solid #a9bfae;padding:10px 12px;border-radius:12px;max-width:100%;background:#fff;color:#173f35}.winkel-quiz-setup{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-bottom:25px}.winkel-quiz-setup>section{padding:22px;background:white;border:1px solid var(--winkel-line);border-radius:20px}.winkel-quiz-setup label{display:grid;gap:7px}.winkel-page .quiz-setting-row{display:flex;gap:12px;align-items:end;flex-wrap:wrap}.winkel-page .quiz-setting-row input{max-width:110px}.winkel-page .bio-quiz-shell{background:transparent}.winkel-page .bio-quiz-layout{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:22px;margin:22px 0}.winkel-page .bio-image-card,.winkel-page .bio-question-card{background:#fff;padding:24px;border:1px solid var(--winkel-line);border-radius:20px;min-width:0;margin:0}.winkel-page .bio-image-frame{min-height:0;background:none}.winkel-page .bio-image-fallback{min-height:80px;background:none;color:inherit}.winkel-page .bio-options{display:grid;gap:10px}.winkel-page .bio-option{width:100%;justify-content:flex-start;text-align:left;white-space:normal}.winkel-page .bio-option.correct{background:#d9efda;border-color:#548c5b}.winkel-page .bio-option.wrong{background:#fff0df}.winkel-page .qr-game-list{overflow-wrap:anywhere}.winkel-page .live-quiz-columns{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.winkel-page .live-quiz-panel,.winkel-page .live-quiz-lower{max-width:100%;min-width:0}.winkel-page .live-quiz-lower{margin-top:24px}.winkel-page .live-quiz-lower article{background:white;border:1px solid var(--winkel-line);padding:18px;border-radius:18px}.winkel-page .qr-game-list p{display:grid;gap:3px}.winkel-page .qr-game-list span{font-size:14px}.winkel-page .live-quiz-room img{width:240px;max-width:100%;height:auto;display:block}.winkel-page .live-quiz-room small{overflow-wrap:anywhere}.winkel-page .live-quiz-player-result-card li{display:flex;justify-content:space-between;gap:14px}.winkel-page .live-quiz-player-result-card .is-own{background:#e4efdb}.winkel-page .angle-estimate-answer{display:grid;gap:12px}.winkel-page .angle-estimate-answer input{width:100%}.winkel-page .live-quiz-note{font-size:14px}.winkel-page .live-quiz-topline,.winkel-page .live-quiz-host-controls{display:flex;gap:12px;align-items:center;flex-wrap:wrap}.winkel-page .live-quiz-switch{display:flex;gap:12px;align-items:center}.winkel-page .live-quiz-switch input{width:24px;height:24px}.winkel-page [data-live-lower-home]{display:none!important}.winkel-page .bio-feedback{padding:16px;font-size:16px;line-height:1.55}.winkel-page .connection-warning{padding:16px;background:#fff0d4;border-radius:13px}.winkel-page .quiz-question-count{font-size:15px;font-weight:850;color:#566c5c}
@media(max-width:800px){.winkel-hero{grid-template-columns:1fr}.winkel-summary{padding:18px}.winkel-summary>b{font-size:32px}.winkel-layout{grid-template-columns:1fr}.winkel-layout>nav{position:static}.winkel-layout nav ol{grid-template-columns:1fr 1fr;gap:6px}.winkel-layout nav button{height:100%;font-size:13px;padding:10px}.winkel-layout nav b{font-size:18px;min-width:22px}.winkel-page main{padding:20px 14px 50px}.winkel-page .topbar{padding:16px;align-items:flex-start;flex-wrap:wrap}.winkel-page .topbar nav{gap:12px;font-size:14px}.winkel-station{padding:19px 15px}.winkel-page .bio-quiz-layout,.winkel-quiz-setup,.winkel-page .live-quiz-columns{grid-template-columns:1fr}.winkel-page .bio-image-card,.winkel-page .bio-question-card{padding:16px}.winkel-page .estimate-controls button{flex:1 1 42%}.winkel-page .estimate-controls .primary{flex-basis:100%}.winkel-page .winkel-diagram text{font-size:25px}.winkel-page .winkel-diagram{max-height:none}.winkel-page .live-quiz-player-result-card ol{padding-left:22px}}
.winkel-top{max-width:1240px;margin:auto;padding:22px;display:flex;justify-content:space-between;align-items:center;gap:18px;border-bottom:1px solid #c9d9ce}.winkel-top>a:first-child{font-size:24px;font-weight:900;text-decoration:none}.winkel-top span{font-size:14px}.winkel-footer{max-width:1240px;margin:auto;padding:24px;font-size:14px}.winkel-page .winkel-settings{padding:24px;background:white;border:1px solid var(--winkel-line);border-radius:20px;margin-bottom:24px}.winkel-page #winkelSettings{display:flex;align-items:center;gap:14px;flex-wrap:wrap}.winkel-page input[type=number],.winkel-page #winkelRoom{background:white;color:#173f35;border:1px solid #9db7a6;border-radius:10px;padding:12px;min-height:48px;max-width:100%}.winkel-page #winkelCount{width:110px}.winkel-page #winkelJoin{display:grid;gap:10px}.winkel-page .winkel-guess-form{display:grid;gap:14px}.winkel-page .winkel-guess-form label{display:grid;gap:10px}.winkel-page .bio-image-card>svg{width:100%;height:auto;display:block}.winkel-page [data-angle-art]{width:100%}@media(max-width:600px){.winkel-top{flex-wrap:wrap;padding:16px}.winkel-top span{order:3;width:100%}.winkel-page .winkel-settings{padding:18px}.winkel-page #winkelSettings{display:grid}.winkel-page .bio-quiz-layout{gap:16px}.winkel-page .winkel-diagram .vertex{font-size:28px}}

body.winkel-page[data-angle-app=lesson]{background:radial-gradient(ellipse at 100% 0,#e2ede3,transparent 45%),#f5f5ef}.winkel-page[data-angle-app=lesson] .winkel-hero{position:relative;isolation:isolate;border-radius:28px;background:#173e35;color:white;padding:36px;overflow:hidden;box-shadow:0 15px 50px #153f3514}.winkel-page[data-angle-app=lesson] .winkel-hero:before{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(100deg,#103b34fa,#173e36dd),url('/shared/math6/assets/math-workshop-hero-v1.webp') center/cover}.winkel-page[data-angle-app=lesson] .winkel-hero .eyebrow,.winkel-page[data-angle-app=lesson] #winkelSave{color:#d6e6da}.winkel-page[data-angle-app=lesson] .winkel-hero em{color:#f0d28e}.winkel-page[data-angle-app=lesson] .winkel-summary{background:#fffffff0;color:#193f34;border:0}.winkel-page[data-angle-app=lesson] .winkel-layout nav button[aria-current=step]{background:#173f35;color:white}.winkel-page[data-angle-app=lesson] .winkel-layout nav button[aria-current=step] small{color:#cfdfd2}.winkel-page[data-angle-app=lesson] .winkel-station{box-shadow:0 8px 35px #173f3506}.winkel-page[data-angle-app=lesson] .angle-lab{border-radius:21px;border:1px solid #bfd4c5;background:#f0f6ed;padding:22px}.winkel-page[data-angle-app=lesson] .angle-visual{background:white;border:1px solid #d5e2d3;border-radius:17px;padding:10px}.winkel-page[data-angle-app=lesson] .angle-controls{background:#fff;border-radius:13px;padding:18px}.winkel-page[data-angle-app=lesson] .angle-result{background:#fcf1d7;padding:16px;border-radius:12px;font-weight:800}.winkel-page[data-angle-app=lesson] .winkel-question{border-top:4px solid #487e62;background:white;box-shadow:0 5px 22px #173f3508}.winkel-page[data-angle-app=lesson] .winkel-options label:has(input:checked){background:#e0eed9;border-color:#477953;box-shadow:inset 4px 0 #477953}.winkel-page[data-angle-app=lesson] .winkel-estimate-game{background:#fff9ec;border-color:#d7bd85}.winkel-page[data-angle-app=lesson] .winkel-question legend{font-size:20px}@media(max-width:800px){.winkel-page[data-angle-app=lesson] .winkel-hero{padding:25px 22px}.winkel-page[data-angle-app=lesson] .angle-lab{padding:16px 12px}.winkel-page[data-angle-app=lesson] .angle-controls{padding:14px}.winkel-page[data-angle-app=lesson] .winkel-question legend{font-size:18px}}