:root{--page: #e7eaeb;--paper: #f8f8f5;--line: #c9cfd3;--ink: #24303a;--frame: #6b747c;--dot: #98a3ab;--accent: #7a4fd6}*{box-sizing:border-box}html,body{margin:0;min-height:100%}body{background:var(--page);color:var(--ink);font:15px/1.4 ui-sans-serif,system-ui,-apple-system,Segoe UI,sans-serif;display:flex;justify-content:center;user-select:none;-webkit-user-select:none}main{width:min(720px,100% - 32px);padding:24px 0 32px;display:flex;flex-direction:column;gap:16px}header{display:flex;align-items:center;gap:16px;min-height:32px;position:relative;flex-wrap:wrap;row-gap:8px}.actions{display:flex;align-items:center;gap:8px}header h1{flex:1}header #status{order:3;flex:0 0 100%;white-space:normal}header #status:empty{display:none}@media (max-width: 560px){header{gap:8px}}:root{--star: #d29b1f}header .stars{font-size:17px;letter-spacing:1px;line-height:1;padding:4px 8px;color:var(--frame);white-space:nowrap}.stars .on,.pc-stars .on{color:var(--star)}.star-panel{position:absolute;top:calc(100% + 8px);right:0;z-index:20;width:min(340px,calc(100vw - 32px));background:#fff;border:1px solid var(--line);border-radius:8px;box-shadow:0 6px 24px #24303a2e;padding:8px 14px;font-size:13px}.sp-row{display:flex;gap:10px;padding:8px 0;border-top:1px solid var(--line)}.sp-row:first-child{border-top:0}.sp-row p{margin:3px 0 0}.sp-star{font-size:18px;line-height:1.1;color:var(--frame)}.sp-row.done .sp-star{color:var(--star)}.sp-row.later{opacity:.55}.sp-goal{font-weight:600}.sp-goal button{margin-top:2px}.sp-all{margin:6px 0 4px;color:#2f7d4f;font-weight:600}.pc-stars{font-size:15px;letter-spacing:1px;color:var(--frame)}:root{--heart: #d0466b}.sp-rate{border-top:1px solid var(--line);padding:8px 0 4px}.hearts{display:flex;flex-wrap:wrap;align-items:center;gap:2px;margin-top:4px}.hearts .heart{border:0;background:none;padding:2px 4px;font-size:22px;line-height:1;color:var(--frame);cursor:pointer}.hearts .heart.on{color:var(--heart)}.hearts .heart:hover{transform:scale(1.15)}.hearts-msg{flex-basis:100%;color:#b3261e;font-size:12px}.hearts-msg:empty{display:none}.pc-hearts{font-size:13px;letter-spacing:1px;color:var(--heart)}.sp-reset{border-top:1px solid var(--line);padding:8px 0 4px;display:flex;flex-wrap:wrap;align-items:center;gap:6px}.sp-reset p{margin:0 0 2px;flex-basis:100%}.sp-reset .link{border:0;background:none;padding:0;color:var(--frame);text-decoration:underline;cursor:pointer;font:inherit}.sp-reset .link:hover{color:var(--ink)}.sp-reset .danger{color:#fff;background:#b8433a;border-color:#b8433a}.puzzle-card svg.pc-heart{fill:#f3d3dc;stroke:var(--heart)}h1{margin:0;font-size:16px;font-weight:600;letter-spacing:.25em;text-transform:uppercase}#status{flex:1;font-size:13px;opacity:.75;font-variant-numeric:tabular-nums;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}button{font:inherit;font-size:13px;color:var(--ink);background:transparent;border:1px solid var(--line);border-radius:6px;padding:4px 12px;cursor:pointer}button:hover{background:#fff}button:disabled{opacity:.35;cursor:default}button:disabled:hover{background:transparent}button.icon{width:32px;height:32px;padding:0;display:inline-grid;place-items:center;border-radius:50%}button.icon svg{display:block;width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}button.icon svg .dot{fill:currentColor}#home svg{stroke-width:1.8}button.primary{background:var(--ink);color:#fff;border-color:var(--ink)}button.primary:hover{background:#3a4854}#game{display:flex;flex-direction:column;gap:16px}[hidden]{display:none!important}.panel{background:#fff;border:1px solid var(--line);border-left:4px solid var(--accent);border-radius:4px;padding:12px 16px;display:flex;flex-direction:column;gap:8px}.panel-head{display:flex;align-items:center;justify-content:space-between;gap:12px}.panel h2{margin:0;font-size:15px}.panel p{margin:0;font-size:14px}#lesson #next{align-self:flex-start}.review{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 20px;font-size:14px}@media (max-width: 560px){.review{grid-template-columns:minmax(0,1fr)}}.review h3{margin:0 0 4px;font-size:14px}.review p{margin:0 0 4px}.review ul{margin:0;padding-left:18px}.review li{margin:2px 0}.review .x{color:#d64545;font-style:italic;font-weight:700}.examples{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px 12px;margin:4px 0}.examples[data-n="4"]{grid-template-columns:repeat(4,minmax(0,1fr))}@media (max-width: 560px){.examples[data-n="4"]{grid-template-columns:repeat(2,minmax(0,1fr))}.examples[data-n="4"] .example svg{max-width:150px}}.example{margin:0;display:flex;flex-direction:column;align-items:center;gap:6px;min-width:0}.example svg{display:block;width:100%;max-width:180px;height:auto}.example .paper{fill:var(--paper)}.example .frame{fill:none;stroke:var(--frame)}.example .seam{stroke:#d64545;stroke-width:4}.example .flag{fill:#d64545;font:italic 700 16px ui-sans-serif,system-ui,-apple-system,Segoe UI,sans-serif;text-anchor:end;stroke:#fff;stroke-width:3;stroke-linejoin:round;paint-order:stroke}.example figcaption{display:flex;flex-direction:column;align-items:center;text-align:center;font-size:13px;line-height:1.3}.example .verdict{font-size:22px;font-weight:700;line-height:1}.example.bad .verdict{color:#d64545}.example.good .verdict{color:#2f7d4f}.example .formula{font-weight:600;font-variant-numeric:tabular-nums}.example .note{font-size:12px;color:#5b6670}.example .note:empty{display:none}@media (max-width: 420px){.examples{gap:8px}.example figcaption{font-size:12px}.example .verdict{font-size:18px}}.fields{display:flex;flex-wrap:wrap;gap:8px 16px}.fields label{display:flex;align-items:center;gap:6px;font-size:13px}.fields input{font:inherit;font-size:14px;color:var(--ink);border:1px solid var(--line);border-radius:4px;padding:4px 6px}#ed-name{width:12em}#ed-cols,#ed-rows{width:4.5em}.panel .row{display:flex;align-items:center;gap:12px;flex-wrap:wrap}#ed-msg{font-size:13px}#ed-msg.ok{color:#2f7d4f}#ed-msg.error,.error{color:#c0392b}#chooser{display:flex;flex-direction:column;gap:12px}#chooser h2{margin:0;font-size:14px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;opacity:.7}#puzzle-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px}.puzzle-card{display:flex;flex-direction:column;align-items:stretch;gap:6px;padding:10px;background:#ffffff8c;border-radius:6px;text-align:left}.puzzle-card:hover{background:#fff;border-color:var(--frame)}.puzzle-card svg{display:block;width:100%;height:110px}.puzzle-card .pv-paper{fill:var(--paper)}.puzzle-card .pv-frame{fill:none;stroke:var(--frame);stroke-width:1.5}.pc-name{font-size:15px;font-weight:600}.puzzle-card svg.pc-new{fill:none;stroke:var(--frame);stroke-width:2.5;stroke-linecap:round}h1 .sub{font-weight:400;letter-spacing:.1em;opacity:.6;text-transform:lowercase}.pc-meta{font-size:12px;opacity:.7;font-variant-numeric:tabular-nums}.puzzle-card svg.pc-folder{fill:#e9dfc4;stroke:var(--frame);stroke-width:2;stroke-linejoin:round;padding:18px 0}.puzzle-card svg.pc-new-folder{fill:none;stroke-dasharray:4 3}.puzzle-card svg.pc-series{padding:4px 0}.puzzle-card svg.pc-series .pc-card{fill:var(--paper);stroke:var(--frame);stroke-width:1}.crumbs{display:flex;flex-wrap:wrap;align-items:center;gap:6px;font-size:14px}.crumbs button{font:inherit;background:none;border:none;padding:2px 0;color:var(--accent);cursor:pointer;text-decoration:underline;text-underline-offset:3px}.crumbs span{font-weight:600}.crumbs .sep{font-weight:400;opacity:.5}#puzzle-list.gallery{grid-template-columns:repeat(auto-fill,minmax(220px,1fr))}#puzzle-list.gallery .puzzle-card svg{height:auto;max-height:260px}#puzzle-list.stats{display:block;width:min(calc(100vw - 32px),1600px);margin-left:50%;transform:translate(-50%)}.stats-table thead th.text{text-align:left}.stats-note{margin:0 0 10px;font-size:13px;opacity:.75}.stats-wrap{overflow:auto;max-height:calc(100vh - 220px);border:1px solid var(--line);border-radius:6px;background:#ffffff8c}.stats-table{border-collapse:separate;border-spacing:0;font-size:13px;font-variant-numeric:tabular-nums;white-space:nowrap}.stats-table th,.stats-table td{padding:4px 8px;border-bottom:1px solid var(--line);text-align:right}.stats-table td.text,.stats-table th[scope=row]{text-align:left}.stats-table td.missing{opacity:.55;font-style:italic}.stats-table td.hearts-cell{color:var(--heart);text-align:left}.stats-table thead th{position:sticky;top:0;z-index:2;background:var(--paper, #fbf8f1)}.stats-table th[scope=row]{position:sticky;left:0;z-index:1;background:var(--paper, #fbf8f1);font-weight:600}.stats-table thead th:first-child{left:0;z-index:3}.stats-table button{font:inherit;background:none;border:none;padding:0;color:inherit;cursor:pointer}.stats-table thead button{font-weight:600}.stats-table th[scope=row] button{color:var(--accent);text-decoration:underline;text-underline-offset:3px;text-align:left}.stats-table tbody tr:hover td{background-color:#7a4fd60f}.gallery-kind{grid-column:1 / -1;display:flex;justify-self:start}.gallery-kind button{font:inherit;font-size:14px;padding:5px 14px;cursor:pointer;background:var(--paper, #fff);color:inherit;border:1px solid var(--line)}.gallery-kind button:first-child{border-radius:6px 0 0 6px}.gallery-kind button:last-child{border-radius:0 6px 6px 0;border-left:none}.gallery-kind button[aria-pressed=true]{background:var(--accent);border-color:var(--accent);color:#fff}.puzzle-card.sortable{user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}#puzzle-list.sorting-list,#puzzle-list.sorting-list .puzzle-card{cursor:grabbing}.puzzle-card.sorting{opacity:.55;border-color:var(--accent);border-style:dashed}#board .arrow,.arrow-tool .arrow,#ghost .arrow{fill:var(--accent);stroke:#fff;stroke-width:2.5;stroke-linejoin:round;paint-order:stroke}#board .arrow{pointer-events:none}.arrow-off{fill:none;stroke:var(--frame);stroke-width:3;stroke-linecap:round}.series{display:flex;flex-wrap:wrap;align-items:center;gap:8px 14px;font-size:13px}.series label{display:flex;align-items:center;gap:6px}.series label.check{gap:4px}#ed-repeat{width:4em;font:inherit;border:1px solid var(--line);border-radius:4px;padding:4px 6px}#ed-folder{font:inherit;font-size:14px;border:1px solid var(--line);border-radius:4px;padding:3px 4px;max-width:14em}.arrow-tools{display:flex;gap:4px}.arrow-tool{width:40px;height:40px;padding:0;display:grid;place-items:center;touch-action:none;cursor:grab}.arrow-tool svg{width:30px;height:30px;display:block;pointer-events:none}.panel p.series-help{font-size:12px;opacity:.75}#ghost.arrow-ghost svg{width:36px;height:36px}#board{display:block;margin:0 auto;width:100%;height:auto;touch-action:none;cursor:crosshair}#board .paper{fill:var(--paper)}#board .frame{fill:none;stroke:var(--frame)}#board .keep{fill:none;stroke:var(--ink);stroke-width:2}#board .marks rect{fill:var(--dot)}.nb-tint{fill:#f3f3ef}.nb-line{stroke:var(--line)}.nb-line-sm{stroke:var(--dot)}.nb-edge{fill:none;stroke:var(--frame);stroke-width:1.5}#board .block{cursor:grab}#board .preview-ok{opacity:.45}#board .block.armed .edge,#board .block.selected .edge{stroke:var(--accent);stroke-width:4}#board .block .sel{fill:var(--accent);opacity:.18;pointer-events:none}body.selecting #board,body.selecting #board *{cursor:crosshair!important}#board .marquee{fill:var(--accent);fill-opacity:.08;stroke:var(--accent);stroke-width:2;stroke-dasharray:6 4;pointer-events:none}#seltools{position:fixed;left:0;top:0;z-index:5;display:flex;flex-direction:column;gap:4px;padding:4px;background:#fff;border:1px solid var(--line);border-radius:8px;box-shadow:0 4px 12px #14283c26}#seltools[hidden]{display:none}#seltools.row{flex-direction:row}#seltools button{width:56px;height:44px;padding:3px;border-radius:6px;display:grid;place-items:center}#seltools svg{width:48px;height:38px}#seltools svg rect{fill:#f3e7b8;stroke:var(--ink);stroke-width:1.2}#seltools svg .ar{fill:none;stroke:var(--ink);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}#seltools svg .axis{stroke:var(--accent);stroke-width:1.5;stroke-dasharray:3 2}#seltools button[aria-pressed=true]{background:var(--accent);border-color:var(--accent)}#seltools button[aria-pressed=true] svg .ar{stroke:#fff}#seltools button[aria-pressed=true] svg rect{stroke:#fff}#seltools button.bad{background:#f6d6d6;border-color:#d64545}#board .cursor-under{fill:#7a4fd61f;stroke:#fff;stroke-width:5;pointer-events:none}#board .cursor{fill:none;stroke:var(--accent);stroke-width:3;stroke-dasharray:8 5;pointer-events:none}#board .focus-under{fill:none;stroke:#fff;stroke-width:5;pointer-events:none}#board .focus{fill:none;stroke:var(--accent);stroke-width:2.5;pointer-events:none}#board .focus.bad{stroke:#d64545}#board .cursor.bad{stroke:#d64545;fill:#d6454526;stroke-dasharray:none}#board .preview-bad rect{fill:#d6454514;stroke:#d64545;stroke-width:2;stroke-dasharray:5 4}#tray{display:flex;flex-wrap:wrap;justify-content:center;gap:18px;padding:16px;background:#ffffff8c;border:1px solid var(--line);border-radius:4px}body[data-mode=edit] #tray{gap:18px 12px}.tray-item{display:flex;flex-direction:column;align-items:center;gap:4px;cursor:pointer;touch-action:none}.tray-item svg{display:block}.tray-item span{font-size:12px;opacity:.7}.tray-item:hover svg{filter:drop-shadow(0 2px 3px rgba(20,60,120,.25))}.tray-item:focus-visible{outline:none}.tray-item.selected svg,.tray-item:focus-visible svg{outline:2px solid var(--ink);outline-offset:4px}.tray-item.selected span{opacity:1;font-weight:600}#ghost{position:fixed;left:0;top:0;pointer-events:none;z-index:10;display:none;filter:drop-shadow(0 4px 8px rgba(20,60,120,.3))}#ghost.active{display:block}#ghost.removing{opacity:.35}body.dragging,body.dragging *{cursor:grabbing!important}.hint{margin:0;font-size:13px;opacity:.7;text-align:center}.site-footer{margin-top:8px;text-align:center;font-size:13px}.site-footer a{color:var(--frame)}kbd{font:inherit;font-size:12px;border:1px solid var(--line);border-radius:4px;padding:0 5px;background:#fff}#annot{pointer-events:none}#board .seam{stroke:#d64545;stroke-width:4}#board .flag{fill:#d64545;font:italic 700 12px ui-sans-serif,system-ui,-apple-system,Segoe UI,sans-serif;text-anchor:end;stroke:#fff;stroke-width:3;stroke-linejoin:round;paint-order:stroke}#board .block.fixed{cursor:default}#status.done{opacity:1;color:#2f7d4f;font-weight:600}