:root{font-family:"Trebuchet MS",Arial,sans-serif;color:#211c29;background:#327c27 url(assets/green-paper.png);font-synthesis:none;--purple:#743683;--yellow:#f5df58;--ink:#211c29;--paper:#fffdf3;--cut:polygon(1% 2%,98.8% 0,100% 96%,97% 100%,.3% 98%,0 6%)}
*{box-sizing:border-box}body{margin:0}a{color:inherit}header{max-width:1180px;margin:0 auto;padding:26px 26px 18px;display:flex;justify-content:space-between;align-items:center;gap:18px}.brand{font-size:25px;font-weight:900;text-decoration:none;position:relative;isolation:isolate;padding:12px 22px;transform:rotate(-2deg);color:#fff}.brand:before{content:"";position:absolute;inset:0;z-index:-1;background:#193d70;clip-path:polygon(0 0,100% 5%,97% 100%,2% 92%)}.brand span{color:#ffe671}.brand .dot{color:#ff9c40;font-size:16px;margin-left:6px}header>span{color:#fffdf3;font-size:14px;letter-spacing:.5px;font-weight:bold}main{max-width:1180px;padding:0 26px;margin:auto}.hero{display:flex;align-items:center;justify-content:space-between;gap:30px;padding:32px 8px 42px}.eyebrow{display:inline-block;font-size:12px;letter-spacing:1.8px;font-weight:900;color:#352039;background:var(--yellow);padding:9px 14px;transform:rotate(-1.5deg);clip-path:polygon(0 4%,100% 0,98% 100%,1% 94%);margin:0 0 14px}h1{font-size:clamp(38px,5.1vw,64px);font-weight:900;letter-spacing:-2px;line-height:1.07;margin:8px 0 20px}h1 span{color:var(--yellow)}.hero h1{color:#fffdf3;text-shadow:3px 3px 0 #244f28}.intro{font-size:18px;line-height:1.7;color:#fffdf3;margin-bottom:0}.letter-art{position:relative;width:315px;height:245px;flex-shrink:0;filter:drop-shadow(7px 9px 0 #213f29)}.letter-art:before{content:"";position:absolute;inset:10px -8px 0;background:#193d70;clip-path:polygon(0 0,100% 8%,96% 98%,5% 92%);transform:rotate(5deg)}.letter-art b,.letter-art i,.letter-art span{display:grid;place-items:center;position:absolute;width:132px;height:126px;font-size:76px;font-weight:900;font-style:normal;line-height:1;clip-path:polygon(0 8%,96% 0,100% 93%,4% 100%)}.letter-art b{color:#fff7dc;background:#e34733;left:12px;top:0;transform:rotate(-12deg)}.letter-art i{color:#321b44;background:#ffac43;right:0;top:26px;transform:rotate(8deg);font-size:66px}.letter-art span{background:#eddb58;color:#341b43;top:126px;left:100px;transform:rotate(-8deg);font-size:64px}.filters{display:flex;gap:20px;padding:24px 28px;background:var(--purple);box-shadow:6px 7px 0 #244f28;transform:rotate(-.4deg);position:relative}.filters:before{content:"";position:absolute;inset:-6px -3px;background:var(--purple);z-index:-1;clip-path:var(--cut)}.filters label{color:#fff}.filters label:first-child{flex:1}label{font-size:14px;font-weight:700;display:block}input,select,textarea,button{font:inherit}input[type=search],select{display:block;width:100%;margin-top:8px;padding:12px;border:2px solid #32233f;border-radius:0;font-size:16px;min-height:48px;background:var(--paper);color:var(--ink)}button{min-height:46px;border:0;border-radius:0;padding:12px 18px;font-weight:800;cursor:pointer;background:transparent;color:var(--ink);position:relative;isolation:isolate}button:before{content:"";position:absolute;inset:0;background:#f0e7d4;z-index:-1;clip-path:polygon(1% 4%,98% 0,100% 95%,0 100%)}button:hover:before{background:#ffe577}button:disabled{opacity:.5;cursor:default}.primary:before{background:var(--yellow)}.quiet:before{background:#ebe5d7}.muted{color:#5c5260;font-size:14px;line-height:1.65}#catalog>.muted,#catalog-status{color:#fffdf3}#catalog-status{font-weight:800;margin-top:28px}#catalog>.muted{margin-top:-3px}.list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;padding:12px 3px 36px}.card{position:relative;isolation:isolate;padding:26px;display:flex;flex-direction:column;gap:16px;filter:drop-shadow(4px 5px 0 #244f28)}.card:before{content:"";position:absolute;inset:0;z-index:-1;background:var(--paper);clip-path:var(--cut)}.card:nth-child(3n+2):before{clip-path:polygon(0 0,100% 3%,98% 100%,1% 97%)}.card h2{font-size:25px;margin:0;line-height:1.2}.card p{margin:0;color:#5c5260;font-size:14px}.card button{margin-top:auto;text-align:left;display:flex;justify-content:space-between;color:#fff}.card button:before{background:var(--purple)}.card button:hover:before{background:#54215f}.card small{font-size:12px;font-weight:900;color:#743683;letter-spacing:.8px}.exercise-heading{display:flex;align-items:center;justify-content:space-between;gap:16px;color:#fffdf3}.badge{white-space:nowrap;background:var(--yellow);color:var(--ink);padding:14px 20px;clip-path:polygon(0 5%,100% 0,97% 100%,2% 96%);font-weight:bold;transform:rotate(3deg)}#exercise,#results{padding-top:22px}#exercise>.quiet{margin-bottom:25px}#exercise h1{font-size:48px;text-shadow:3px 3px 0 #244f28}.exercise-heading .eyebrow{color:#352039}progress{width:100%;height:9px;accent-color:var(--yellow);margin-bottom:28px;background:#244f28}progress::-webkit-progress-bar{background:#244f28}progress::-webkit-progress-value{background:var(--yellow)}.workspace{display:grid;grid-template-columns:minmax(0,3fr) minmax(220px,1fr);gap:28px}.writing{background:var(--paper);position:relative;isolation:isolate;padding:32px;box-shadow:6px 7px 0 #244f28}.writing:before{content:"";position:absolute;top:-6px;left:0;right:0;height:11px;background:var(--paper);clip-path:polygon(0 100%,1% 10%,27% 50%,55% 0,78% 50%,99% 10%,100% 100%)}.playbar,.actions{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap}#status{min-height:48px;line-height:1.5;color:#5c5260}.answer-label{font-size:19px;margin-bottom:12px}textarea{width:100%;resize:vertical;min-height:190px;line-height:1.8;padding:16px;border:2px solid #9a8c9d;border-radius:0;font-size:22px;color:var(--ink);background:white}textarea:read-only{background:#ece6ed}.check{display:flex;align-items:flex-start;gap:10px;line-height:1.5;min-height:44px}input[type=checkbox]{width:22px;height:22px;flex-shrink:0;margin:0;accent-color:var(--purple)}aside{position:relative;isolation:isolate;padding:22px 24px 30px;font-size:15px;line-height:1.7;align-self:start;filter:drop-shadow(4px 5px 0 #244f28)}aside:before{content:"";position:absolute;inset:0;z-index:-1;background:#f2db6e;clip-path:polygon(2% 0,97% 2%,100% 97%,4% 100%,0 6%)}aside h2{font-size:23px;margin:2px 0 22px}aside p{color:#51422d}:focus-visible{outline:3px solid #35204d;outline-offset:4px}header :focus-visible,#back:focus-visible{outline-color:#fff}footer{padding:38px 0 25px;color:#fffdf3;font-size:12px;line-height:1.7}footer span{display:block;margin-top:6px}#results>h1,#result-title,#results>.muted{color:#fffdf3}.scores{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.score{position:relative;isolation:isolate;padding:20px 24px;filter:drop-shadow(4px 4px 0 #244f28)}.score:before{content:"";position:absolute;inset:0;z-index:-1;background:var(--paper);clip-path:var(--cut)}.score strong{display:block;font-size:40px;margin-bottom:8px;color:#743683}.score span{font-size:15px}.comparison{background:var(--paper);padding:26px;border-left:8px solid #743683;box-shadow:4px 4px 0 #244f28;margin:20px 0;overflow-wrap:anywhere}.comparison h2{font-size:20px}.comparison p{line-height:1.7;white-space:pre-wrap}.comparison ul{padding-left:24px;line-height:1.7}.comparison small{color:#5c5260;font-weight:bold;letter-spacing:1px}[hidden]{display:none!important}@media(max-width:750px){.letter-art{transform:scale(.75);transform-origin:right center;width:230px}.list{grid-template-columns:repeat(2,minmax(0,1fr))}.workspace{grid-template-columns:1fr}.scores{grid-template-columns:repeat(2,minmax(0,1fr))}aside{padding:24px}.hero{gap:0}.writing{padding:24px}}@media(max-width:500px){header,main{padding-left:18px;padding-right:18px}header>span{display:none}.brand{font-size:23px}.hero{padding:24px 0 30px}.letter-art{display:none}.filters{flex-direction:column;padding:20px;transform:none}.list{grid-template-columns:1fr}.writing{padding:18px}.exercise-heading{align-items:flex-start;flex-direction:column;gap:0}.badge{margin-bottom:20px}#exercise h1{font-size:38px}.actions button{flex:1}.intro{font-size:17px}textarea{font-size:20px}.playbar button{padding:10px}.scores{gap:12px}.score{padding:18px}.score span{font-size:14px}.comparison{padding:18px}h1{letter-spacing:-1px}.eyebrow{letter-spacing:1.3px;font-size:11px}}
/* A single-window review: the two documents scroll inside their paper panels. */
body.review-mode{height:100dvh;overflow:hidden}body.review-mode>header{height:66px;padding-top:10px;padding-bottom:10px}body.review-mode>main{height:calc(100dvh - 66px);display:flex;flex-direction:column;padding-bottom:14px}body.review-mode footer{display:none}#results{min-height:0;flex:1;display:flex;flex-direction:column;padding-top:4px;gap:10px;outline:none}.review-heading{display:flex;justify-content:space-between;align-items:center;gap:15px}.review-heading .eyebrow{font-size:10px;padding:4px 10px;margin:0 0 3px}.review-heading h1{font-size:30px;line-height:1.15;letter-spacing:-.5px;margin:4px 0;color:var(--paper)}.review-heading .actions{flex-wrap:nowrap}.review-heading button{font-size:14px}.review-legend{display:flex;gap:7px;flex-wrap:wrap}.legend-item{background:var(--paper);border-bottom:3px solid var(--error);padding:5px 8px;font-size:12px;white-space:nowrap;color:#302938}.legend-item b{color:var(--error);font-size:16px;margin-right:2px}.type-major{--error:#b42318;--tint:#ffebe7}.type-minor{--error:#a54800;--tint:#fff0d8}.type-other{--error:#175cd3;--tint:#eaf1ff}.type-punctuation{--error:#7839a4;--tint:#f2eaff}.type-case{--error:#08766c;--tint:#e0f4ed}.type-spacing{--error:#a32562;--tint:#ffe8f2}.review-hint{font-size:13px;color:#fffdf3;margin:0;line-height:1.4}.review-layout{display:grid;grid-template-columns:minmax(0,1fr) 270px;gap:18px;flex:1;min-height:0}.review-texts{display:grid;grid-template-rows:minmax(0,1fr) minmax(0,1fr);gap:14px;min-height:0}.text-sheet{display:flex;flex-direction:column;min-height:0;background:var(--paper);box-shadow:4px 4px 0 #244f28;padding:14px 18px}.text-sheet h2{font-size:13px;text-transform:uppercase;letter-spacing:1.5px;margin:0 0 8px;color:#743683}.review-text{overflow:auto;min-height:0;flex:1;white-space:pre-wrap;font-size:19px;line-height:1.85;overflow-wrap:anywhere;position:relative;padding:3px 4px;scrollbar-gutter:stable}.word-mark{display:inline;min-height:0;min-width:0;border:0;border-bottom:2px solid var(--error);border-radius:2px;margin:0;padding:1px 2px;font-size:inherit;line-height:inherit;font-weight:inherit;color:var(--error);background-color:var(--tint);background-size:100% 3px;background-repeat:no-repeat;background-position:bottom;box-decoration-break:clone;-webkit-box-decoration-break:clone;white-space:pre-wrap}.word-mark:before{display:none}.word-mark:hover,.word-mark.selected{outline:2px solid #302938;outline-offset:1px;background-color:#fff0a0}.word-mark:focus-visible{outline:3px solid #193d70;outline-offset:2px}.missing-mark{font-weight:900;padding:1px 5px;border-style:dashed}.correct-sheet .word-mark{color:#211c29;background-color:transparent}.correct-sheet .word-mark.selected{background-color:#f5df58}.review-detail{align-self:stretch;min-height:0;overflow:auto;filter:none;background:var(--paper);padding:14px 17px;line-height:1.4;box-shadow:4px 4px 0 #244f28}.review-detail:before{display:none}.detail-navigation{display:flex;align-items:center;justify-content:space-between;gap:5px;margin-bottom:15px}.detail-navigation button{padding:6px 12px;font-size:18px;min-width:44px}.detail-navigation span{font-size:12px;color:#5c5260}.review-detail small{font-size:10px;letter-spacing:1px;font-weight:bold}.review-detail>p{font-size:19px;line-height:1.4;margin:5px 0 14px;overflow-wrap:anywhere;color:#211c29}#detail-expected{font-weight:bold;color:#2f6128}.error-rule{border-left:4px solid var(--error);padding:8px 0 8px 10px;margin:10px 0;font-size:13px}.error-rule strong{color:var(--error);display:block}.error-rule p{margin:5px 0;overflow-wrap:anywhere;color:#5c5260}@media(max-width:750px){.review-layout{grid-template-columns:minmax(0,1fr) 210px;gap:12px}.review-heading h1{font-size:25px}.review-text{font-size:17px}.text-sheet{padding:10px}.review-detail{padding:10px}}@media(max-width:600px){body.review-mode>header{height:54px;padding-top:5px;padding-bottom:5px}body.review-mode>main{height:calc(100dvh - 54px);padding-bottom:10px;padding-left:12px;padding-right:12px}body.review-mode .brand{font-size:18px;padding:8px 12px}#results{gap:7px}.review-heading{gap:7px}.review-heading .eyebrow{display:none}.review-heading h1{font-size:20px;max-width:150px}.review-heading .actions{gap:5px}.review-heading button{font-size:11px;padding:8px;max-width:90px;min-height:44px}.review-legend{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px}.legend-item{font-size:9px;padding:3px 4px;white-space:normal;line-height:1.3}.legend-item b{font-size:13px}.review-hint{font-size:11px}.review-layout{grid-template-columns:1fr;grid-template-rows:minmax(150px,1fr) 145px;gap:10px}.review-texts{gap:8px}.review-text{font-size:16px;line-height:1.65}.text-sheet h2{font-size:10px;margin-bottom:3px}.review-detail{position:relative;padding:8px 12px}.detail-navigation{margin-bottom:5px;position:sticky;top:-8px;background:var(--paper);z-index:1}.detail-navigation button{min-height:35px;padding:2px 10px}.review-detail>p{font-size:16px;margin:3px 0 7px}.error-rule{font-size:12px}.review-detail small{font-size:9px}}

/* Letter-level feedback; typography is a suggestion, never a spelling penalty. */
.type-typography{--error:#526879;--tint:#e9eef2}
.word-mark{color:inherit;background-color:transparent;border-bottom:1px dotted #a39b90;padding:1px 0}
.letter-mark{color:#fff;background:var(--error);border-radius:2px;padding:1px 1px;box-decoration-break:clone;-webkit-box-decoration-break:clone}
.letter-mark.type-typography{color:#526879;background:#e9eef2}
.correct-sheet .letter-mark{color:var(--error);background:var(--tint);border-bottom:2px solid var(--error)}
.penalty-score{background:#f5df58;color:#193d70;font-size:17px;font-weight:800;padding:5px 10px;align-self:center}
@media(max-width:600px){.penalty-score{font-size:13px;padding:4px;grid-column:span 2}}

/* Advice retains its own slate colour, including empty reference anchors. */
.word-mark.type-typography{color:#526879;border-bottom:2px dotted #526879;background:#e9eef2}
.word-mark.type-typography.selected,.word-mark.type-typography:hover{background:#dce6ed}

/* Wynik zrobionego dyktanda w katalogu (zapis w tej przeglądarce) */
.card .done-result{margin:6px 0 12px;padding:8px 12px;background:#e7f5e9;border-left:6px solid #1f7a35;color:#193d2a;font-size:15px;line-height:1.4}
.card .done-result strong{color:#1f7a35}
footer a{color:inherit;font-weight:bold}