:root{font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#30453b;background:#f6f5ef;--green:#295c47;--muted:#91988c;--line:#dcded3;--cell:30px;--clue:18px;font-synthesis:none}*{box-sizing:border-box}body{margin:0;height:100dvh;overflow:hidden}button,input{font:inherit}button{cursor:pointer}button:disabled{opacity:.4;cursor:default}button,a{touch-action:manipulation}button{color:inherit}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid #a5bd92;outline-offset:3px}[hidden]{display:none!important}.sr-only{position:absolute;width:1px;height:1px;clip-path:inset(50%);overflow:hidden}button{border:0;background:none}button:hover:enabled{filter:brightness(.94)}.topbar{height:84px;display:flex;align-items:center;padding:0 42px;gap:26px;border-bottom:1px solid #e6e6dd;background:#f9f8f3;position:relative;z-index:3}.brand{font-size:29px;letter-spacing:-1.6px;font-weight:750;display:flex;align-items:center;gap:10px}.brand-dot{color:#94a682;margin-left:-9px}.brand-mark{width:27px;height:27px;display:grid;grid-template-columns:repeat(3,1fr);gap:3px}.brand-mark i{background:var(--green);border-radius:1px}.brand-mark i:nth-child(3),.brand-mark i:nth-child(7){opacity:.17}.header-separator{height:24px;width:1px;background:var(--line)}.puzzle-label{font-size:12px;color:#989d92;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.top-actions{margin-left:auto;display:flex;align-items:center;gap:14px;flex-shrink:0}.button{display:inline-flex;align-items:center;justify-content:center;gap:18px;border-radius:10px;padding:12px 20px;font-size:12px;font-weight:550;white-space:nowrap;transition:background .15s}.primary{background:var(--green);color:#fff}.upload{border:1px solid #d3d9ca;background:#fffdf8;gap:7px}.upload>span:first-child{font-size:19px;line-height:1}.secondary{border:1px solid #d7ddcf;background:#fbfcf6}.quiet{color:#77836f;font-size:12px;padding:9px 8px;border-radius:7px;white-space:nowrap}.quiet:hover{background:#eeefe5}.top-actions .quiet>span{margin-right:5px}main{height:calc(100dvh - 84px);position:relative}.welcome{height:100%;display:flex;align-items:center;justify-content:center;flex-direction:column;text-align:center;padding:35px 20px 45px;overflow:auto}.eyebrow{font-size:9px;letter-spacing:2px;color:#94a083;font-weight:650}.welcome h1{font-family:Georgia,"Times New Roman",serif;font-size:clamp(40px,4.5vw,65px);font-weight:400;letter-spacing:-2.4px;line-height:1.1;margin:19px 0}.welcome p{font-size:13px;line-height:1.9;color:#929888;margin:0 0 27px}.large{padding:15px 26px;min-width:205px;justify-content:space-between}.file-help{font-size:10px;color:#a6aa9d;margin-top:14px}.examples{display:flex;gap:20px;font-size:11px;align-items:center;margin-top:38px}.examples>span{color:#a0a696}.examples button{font-size:11px;color:#738269;padding:5px 0;border-bottom:1px solid #d6ddcb}.examples button span{margin-left:7px}.welcome-art{display:grid;grid-template-columns:repeat(5,17px);gap:3px;margin-bottom:30px;transform:rotate(-7deg);padding:10px;border:1px solid #dae0cd;background:#edf0e4;border-radius:9px;box-shadow:9px 10px 0 #e8ebde}.welcome-art span{height:17px;border:1px solid #d5dcc8;border-radius:2px}.welcome-art span:nth-child(3),.welcome-art span:nth-child(7),.welcome-art span:nth-child(8),.welcome-art span:nth-child(9),.welcome-art span:nth-child(n+11):nth-child(-n+15),.welcome-art span:nth-child(17),.welcome-art span:nth-child(19),.welcome-art span:nth-child(22),.welcome-art span:nth-child(24){background:#6f8d61;border-color:#6f8d61}.puzzle{position:relative;height:100%;padding:16px 40px 110px;display:flex;flex-direction:column}.board-meta{height:30px;display:flex;align-items:center;gap:17px;font-size:10px;color:#9aa18e;flex-shrink:0}.review-status{color:#ae8844;font-size:10px}.review-status.ready{color:#829475}.board-meta #my-board{margin-left:auto;color:var(--green)}.board-viewport{flex:1;min-height:0;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#cdd5bf transparent;padding:12px}.board-stage{min-width:100%;min-height:100%;width:max-content;display:flex;align-items:center;justify-content:center;padding:14px 30px 18px 10px}.board{border-collapse:collapse;table-layout:fixed;font-size:var(--clue);font-variant-numeric:tabular-nums;user-select:none;flex-shrink:0}.board th{padding:0;font-weight:500;color:#5f6d54}.board th.corner{vertical-align:bottom;text-align:right}.corner-decoration{font-size:9px;line-height:1.6;color:#a2ab95;letter-spacing:.7px;padding:0 14px 14px 0}.board .row-clue{padding-right:10px;text-align:right;white-space:nowrap}.board .col-clue{vertical-align:bottom;padding-bottom:10px;text-align:center}.clue-button{padding:5px 4px;min-height:var(--cell);border-radius:5px;font-size:var(--clue);color:inherit;position:relative;line-height:1.1}.row-clue .clue-button{display:flex;margin-left:auto;gap:.48em;align-items:center;justify-content:flex-end;white-space:nowrap}.col-clue .clue-button{display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:3px;width:var(--cell)}.clue-button:hover{background:#e5ebd9}.clue-button.uncertain{color:#a2762e;background:#f3e9d2}.clue-button.reviewed:after{content:'';width:3px;height:3px;background:#7f9a6d;border-radius:50%;position:absolute;right:1px;bottom:2px}.board .cell{border:1px solid #c8d0be;padding:0;height:var(--cell);width:var(--cell);min-width:var(--cell);background:#fffef9}.board .cell.major-right{border-right:2px solid #8f9e80}.board tr.major-bottom .cell{border-bottom:2px solid #8f9e80}.board tr:nth-child(2) .cell{border-top:2px solid #8f9e80}.board .cell:first-of-type{border-left:2px solid #8f9e80}.cell button{display:flex;align-items:center;justify-content:center;width:calc(var(--cell) - 1px);height:calc(var(--cell) - 1px);padding:0;color:#b6bfaa;font-size:calc(var(--cell)*.68);border-radius:0;line-height:1}.cell button:hover:enabled{background:#e6ecdc}.board .cell button{touch-action:pan-x pan-y;-webkit-touch-callout:none}.cell button.filled{background:#345f49}.cell button.filled:hover:enabled{background:#345f49}.cell button.empty{background:#f1f3e9}
/* The cross is drawn, not a glyph: a font's × sits below the middle of the cell. */
.cell button{position:relative}.cell button.empty:before,.cell button.empty:after{content:'';position:absolute;left:50%;top:50%;width:46%;height:max(1px,calc(var(--cell)*.075));background:currentColor;border-radius:1px;transform:translate(-50%,-50%) rotate(45deg)}.cell button.empty:after{transform:translate(-50%,-50%) rotate(-45deg)}.cell button:disabled{opacity:1}.cell button.hinted{box-shadow:inset 0 0 0 3px #d3ad54}.action-dock{position:absolute;left:50%;transform:translateX(-50%);bottom:25px;display:flex;gap:11px;align-items:center;background:#fffef9;padding:9px;border-radius:16px;border:1px solid #e1e5d7;box-shadow:0 10px 35px #40533212;white-space:nowrap}.paint-tools{display:flex;gap:2px;background:#f3f5ec;border-radius:9px;padding:3px}.paint-tools button{height:32px;width:33px;font-size:24px;color:#89967a;border-radius:6px;display:flex;align-items:center;justify-content:center}.paint-tools .active{background:#fff;color:var(--green);box-shadow:0 1px 4px #394d3014}.paint-square{width:12px;height:12px;background:currentColor;border-radius:2px}.dock-divider{height:23px;width:1px;background:#e7eadf}.dock-quiet{font-size:25px;color:#829074;padding:4px 8px}.dock-hint{font-size:12px;padding:10px 10px;color:#63785a}.dock-hint>span{font-size:19px;margin-right:7px;vertical-align:-1px}.action-dock .primary{padding:13px 22px;min-width:120px;justify-content:space-between}.solve-status{position:absolute;bottom:99px;left:50%;transform:translateX(-50%);padding:10px 17px;border-radius:10px;max-width:min(650px,90%);background:#eaf0e2;border:1px solid #d9e3cd;font-size:11px;line-height:1.65;color:#667b57;text-align:center;box-shadow:0 4px 20px #344b2b08}.solve-status.error{color:#9c743b;background:#faf1dd;border-color:#ead9b2}.source-panel{position:absolute;right:18px;top:12px;bottom:18px;z-index:5;width:370px;max-width:calc(100vw - 28px);padding:24px;background:#fffef9;border:1px solid #e0e4d7;border-radius:16px;overflow:auto;box-shadow:0 15px 65px #34422c26}.panel-heading{display:flex;justify-content:space-between;align-items:center;gap:14px}.panel-heading h2{font-family:Georgia,"Times New Roman",serif;font-size:25px;font-weight:400;letter-spacing:-.6px;margin:8px 0}.icon-button{width:30px;height:30px;border-radius:50%;background:#f1f3e9;font-size:22px;line-height:1;color:#7b886e;flex-shrink:0}.muted{font-size:11px;color:#929b88;line-height:1.6;word-break:break-word}.image-wrap{position:relative;line-height:0;width:fit-content;margin:auto}.image-wrap img{width:auto;max-width:100%;max-height:48vh;display:block;border-radius:5px}.image-wrap svg{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}.image-wrap.selecting{cursor:crosshair}.source-actions{display:flex;gap:7px;flex-wrap:wrap;margin:15px 0}.source-actions .quiet{font-size:11px}.source-actions .button{width:100%}.helper{font-size:10px;line-height:1.7;color:#98a08c;margin:10px 0}details{border-top:1px solid #e4e8db;padding:12px 0}summary{font-size:11px;color:#718063;cursor:pointer}.prepared-image{max-width:100%;max-height:350px;object-fit:contain;margin-top:15px}.check-label{display:flex;gap:9px;font-size:11px;align-items:center;margin:15px 0}.check-label input{accent-color:var(--green)}.size-form{display:flex;gap:7px;align-items:end;margin-top:18px}.size-form label{font-size:10px;color:#929c85}.size-form input{width:65px;display:block;margin-top:6px;padding:8px;border:1px solid #d9dfcf;border-radius:6px;background:#fffef8;color:var(--green)}.size-form button{font-size:10px;padding:10px}dialog{border:1px solid #dfe4d5;box-shadow:0 30px 100px #1b382c33;color:#30453b;background:#fffef9;border-radius:18px;padding:26px;max-height:85dvh}dialog::backdrop{background:#35463355;backdrop-filter:blur(4px)}.clue-editor{width:330px;max-width:calc(100vw - 24px)}.clue-editor .panel-heading h2{font-size:23px}.clue-crop-wrap{margin:17px 0;padding:13px;background:#f0f2e8;border-radius:8px;text-align:center;min-height:45px;max-height:210px;overflow:auto}.clue-crop-wrap img{display:block;max-height:180px;max-width:100%;width:auto;margin:auto;image-rendering:auto}.clue-input-label{font-size:11px;color:#869576;display:block;margin:17px 0 7px}#clue-input{width:100%;padding:13px;border:1px solid #ccd7be;border-radius:8px;font-size:21px;letter-spacing:2px;color:var(--green);background:#fffef9}.clue-editor .primary{width:100%;justify-content:space-between;margin-top:18px}.form-error{color:#ac723d;font-size:11px;line-height:1.5}.notification{position:fixed;top:96px;left:50%;transform:translateX(-50%);border:1px solid #dce4ce;border-radius:11px;box-shadow:0 5px 25px #334a2314;padding:13px 22px;background:#fefef8;font-size:12px;line-height:1.7;max-width:90vw;z-index:20;color:#5f6b57}.notification.error{color:#a37638;border-color:#ecdcb9;background:#fff9ec}.notification.busy:before{content:'';display:inline-block;width:10px;height:10px;border:2px solid #ccd7bf;border-top-color:var(--green);border-radius:50%;animation:spin 1s linear infinite;margin-right:10px;vertical-align:-2px}@keyframes spin{to{transform:rotate(360deg)}}.drop-overlay{position:fixed;inset:10px;z-index:50;border:2px dashed #7c9769;background:#f3f6eaf5;display:flex;align-items:center;justify-content:center;border-radius:20px;text-align:center;font-size:30px;font-family:Georgia,serif}.drop-overlay span{display:block;font:12px -apple-system,sans-serif;color:#8e9e7f;margin-top:15px}@media(min-width:1600px){.puzzle{padding-left:65px;padding-right:65px}}@media(max-width:760px){.topbar{height:68px;padding:0 20px;gap:16px}.header-separator,.puzzle-label{display:none}.brand{font-size:26px}.top-actions{gap:6px}.top-actions .quiet{font-size:11px;padding:8px 5px}.top-actions .button{font-size:11px;padding:10px 12px;gap:4px}main{height:calc(100dvh - 68px)}.puzzle{padding:12px 14px 104px}.board-stage{padding:6px 10px 12px 0}.board-viewport{padding:6px}.board-meta{font-size:9px;gap:9px}.action-dock{gap:5px;bottom:20px;padding:7px;border-radius:14px}.paint-tools button{width:28px;height:31px}.dock-divider{margin:0 2px}.dock-quiet{padding:4px 5px}.dock-hint{font-size:11px;padding:9px 7px}.dock-hint>span{margin-right:3px}.action-dock .primary{min-width:96px;padding:12px 15px}.solve-status{bottom:90px;font-size:10px}.notification{top:78px}.welcome{padding:20px 20px 30px}.welcome h1{font-size:48px}.welcome-art{margin-bottom:26px}.examples{gap:14px;flex-wrap:wrap;justify-content:center;margin-top:26px}.examples>span{width:100%}.source-panel{right:9px;top:9px;bottom:10px;width:350px;padding:21px}}@media(max-width:400px){.desktop-only{display:none}.topbar{padding:0 12px;gap:8px}.brand{font-size:24px;gap:7px}.brand-mark{height:23px;width:23px;gap:2px}.top-actions .quiet{font-size:10px}.action-dock{gap:2px}.paint-tools button{width:24px}.action-dock .primary{min-width:84px;padding:12px}.dock-hint{padding:8px 5px}}@media(max-height:720px){.welcome-art{margin-bottom:22px;grid-template-columns:repeat(5,12px);gap:2px;padding:8px}.welcome-art span{height:12px}.welcome h1{font-size:44px;margin:13px 0}.welcome p{margin-bottom:20px}.examples{margin-top:22px}}@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
.guessed-number{position:relative;background:#efdbad;border-radius:3px;padding:2px 3px;color:#956625}.guessed-number sup{position:absolute;right:-3px;top:-4px;font-size:7px;line-height:1;border-radius:50%;background:#fff9eb;width:8px;height:8px;text-align:center;border:1px solid #dbc28c}.clue-alternatives{background:#fbf5e8;border:1px solid #eee0c2;border-radius:9px;padding:11px 12px;margin-top:14px}.alternative-heading{font-size:10px;color:#a28043;margin:0 0 9px}.alternative-group{display:flex;gap:6px;align-items:center;margin-top:6px}.alternative-group>span{font-size:10px;color:#ac9975;margin-right:auto}.alternative-chip{border:1px solid #e3d5b4;background:#fffdf7;border-radius:6px;min-width:30px;height:29px;padding:3px 8px;font-size:13px;color:#9b773a}.alternative-chip:hover,.alternative-chip.selected{background:#e9d6a9;border-color:#c8ab6a;color:#6f5427}
.clue-editor{max-height:94dvh}
.clue-button.unknown{background:#f9ded9;color:#ae493f}.unknown-number{color:#b13e35;background:#f8cfc8;border-radius:3px;padding:2px 3px}.clue-button.unknown .guessed-number{color:#956625;background:#efdbad}.cell button.paper-mark.filled{background:repeating-linear-gradient(135deg,#91a897 0px,#91a897 3px,#bdcbbf 3px,#bdcbbf 5px)}.cell button.paper-mark.empty{color:#9cae9e;background:#edf1eb}.paper-marks{display:flex;align-items:center;justify-content:center;gap:12px;flex-wrap:wrap;font-size:10px;color:#86947e;flex-shrink:0;padding:4px 10px 0}.paper-marks .quiet{font-size:10px;padding:6px 8px;background:#edf1e5}.paper-marks #use-paper{border:1px solid #d6dfcc;color:#547247}.start-board{font-size:22px}.clue-editor{width:430px}.clue-crop-wrap{max-height:270px;padding:6px;overflow:auto}.clue-crop-stage{position:relative;width:fit-content;margin:auto;max-width:100%;line-height:0}.clue-crop-wrap img{max-height:240px;width:auto;max-width:100%}.clue-focus{position:absolute;border:2px solid #b78331;background:#f5d08222;pointer-events:none;box-shadow:0 0 0 1px #fff9}.suggest-clue{font-size:11px;width:100%;margin-top:12px;white-space:normal}.clue-suggestions{margin-top:10px;max-height:220px;overflow:auto}.suggestion-option{display:flex;align-items:center;gap:13px;text-align:left;background:#f7f2e5;border:1px solid #e6dbbe;border-radius:7px;width:100%;padding:9px 11px;margin-top:7px}.suggestion-option strong{font-weight:550;white-space:nowrap;color:#8e7137}.suggestion-option span{font-size:10px;line-height:1.5;color:#938b75}.photo-viewer{width:min(1100px,96vw);height:90dvh;max-height:94dvh;padding:18px 24px;overflow:hidden}.photo-viewer[open]{display:flex;flex-direction:column}.photo-viewer .panel-heading{flex-shrink:0}.photo-toolbar{display:flex;gap:10px;align-items:center;flex-shrink:0}.photo-toolbar .button{padding:7px 13px;font-size:20px}.photo-toolbar #source-settings{margin-left:auto}.photo-viewport{flex:1;min-height:0;overflow:auto;background:#e8ebdf;border-radius:10px;cursor:grab;touch-action:none;overscroll-behavior:contain}.photo-viewport.dragging{cursor:grabbing}.photo-viewport img{display:block;max-width:none;user-select:none;margin:12px}.photo-viewer .helper{flex-shrink:0;margin:10px 0}.action-dock .dock-hint{white-space:nowrap}@media(max-width:760px){.action-dock{gap:3px;max-width:calc(100vw - 12px)}.action-dock .dock-hint{font-size:10px;padding:8px 4px}.dock-hint>span{display:none}.action-dock .primary{min-width:80px;padding:12px}.paper-marks{gap:5px;padding-top:2px;font-size:9px}.paper-marks>span{width:100%;text-align:center}.paper-marks .quiet{padding:4px 7px;font-size:9px}.photo-viewer{padding:14px;width:97vw;height:93dvh}.photo-toolbar{gap:5px}.photo-toolbar .quiet{font-size:10px}.clue-editor{padding:20px}}@media(max-width:400px){.action-dock .paint-tools button{width:21px}.action-dock .dock-quiet{padding:3px}.action-dock .dock-hint{max-width:68px;white-space:normal;line-height:1.3}.action-dock .primary{min-width:73px;padding:11px}.dock-divider{display:none}}
/* Row clues must fit the cell height even when a number needs review. */
.row-clue .clue-button{padding:0 3px}
.reconstruct-button{margin-left:auto;color:#426f4f;background:#e8efdf;border:1px solid #d6e1cb;padding:6px 10px;font-size:10px}.reconstruction-review{width:560px;max-width:calc(100vw - 24px);max-height:92dvh;overflow:auto}.reconstruction-review .panel-heading h2{font-size:25px}.reconstruction-message{font-size:12px;line-height:1.8;color:#6e7f63}.reconstruction-preview{display:grid;grid-template-columns:repeat(var(--preview-cols),var(--preview-cell));width:max-content;max-width:100%;margin:19px auto;background:#fffef8;border:1px solid #c5d0b9;gap:1px;overflow:hidden}.reconstruction-preview>span{width:var(--preview-cell);height:var(--preview-cell);background:#eff2e8}.reconstruction-preview>span.on{background:#57785b}.reconstruction-changes{max-height:240px;overflow:auto;border-top:1px solid #e3e7d8;margin-top:15px}.reconstruction-change{display:flex;align-items:center;gap:20px;justify-content:space-between;font-size:12px;border-bottom:1px solid #e8ebdf;padding:10px 0}.reconstruction-change strong{font-weight:500;color:#7b8c6d}.reconstruction-change>span{color:#a0803d;background:#faf1dd;border-radius:5px;padding:5px 8px;white-space:normal;text-align:right}.reconstruction-review>.primary{width:100%;margin-top:14px}@media(max-width:760px){.board-meta{gap:6px}.reconstruct-button{font-size:9px;padding:5px 7px}.reconstruction-review{padding:20px}.reconstruction-review .panel-heading h2{font-size:23px}}
/* Keep fit calculations aligned with the real clue and stage dimensions. */
.board-stage{padding:6px}
.col-clue .clue-button{padding:0 2px;gap:1px}
.col-clue .guessed-number,.col-clue .unknown-number{padding-top:0;padding-bottom:0}.clue-button>span{letter-spacing:-.04em}.col-clue .clue-button>span.multi-digit{font-size:.84em;letter-spacing:-.06em}
/* Keep the current game in view; a ready answer stays hidden until requested. */
.solution-card{min-height:43px;display:flex;align-items:center;justify-content:flex-end;gap:15px;flex-shrink:0;padding:2px 8px 5px;color:#65715b;font-size:10px}.solution-peek{display:flex;align-items:center;gap:12px;padding:3px 10px;border:1px solid #dce4d1;border-radius:9px;background:#fafcf4;font-size:10px;color:#5d7752}.solution-thumbnail{display:grid;grid-template-columns:repeat(var(--mini-cols),2px);gap:0;width:max-content;overflow:hidden;filter:blur(4px);opacity:.65;pointer-events:none;max-width:80px;max-height:42px}.solution-thumbnail>span{width:2px;height:2px;background:#eff2e8}.solution-thumbnail>span.on{background:#557751}.reconstruction-preview{filter:blur(7px);opacity:.6;pointer-events:none;user-select:none}.dock-photo{display:flex;align-items:center;justify-content:center;flex-direction:column;gap:1px;padding:2px 6px;font-size:9px;color:#718267;min-width:39px}.dock-photo>span:first-child{font-size:23px;line-height:1}.action-dock .primary{font-size:11px;min-width:145px;padding:13px 17px}.clue-button.uncertain{background:none;color:inherit}.guessed-number{background:none;color:inherit;padding:0 2px}.guessed-number sup{background:#f7f8ef;color:#939b81;border:0;right:-3px;top:-3px;font-size:7px}.clue-button.unknown{background:none;color:inherit}.clue-button.unknown .guessed-number{background:none;color:inherit}.unknown-number{color:#b13e35;background:#f8ded8;padding:1px 2px}.review-status.ready{color:#829475}@media(max-width:760px){.solution-card{min-height:42px;padding:2px 0 4px;font-size:9px;gap:7px}.solution-peek{font-size:9px;gap:7px;padding:3px 8px}.action-dock{gap:3px}.action-dock .primary{min-width:115px;padding:12px 10px;font-size:10px}.dock-photo{min-width:30px;padding:2px 3px;font-size:8px}.dock-photo>span:first-child{font-size:21px}.action-dock .dock-hint{max-width:75px;white-space:normal;line-height:1.3}.board-meta .review-status{font-size:9px}}@media(max-width:400px){.action-dock .paint-tools button{width:19px}.action-dock .primary{min-width:93px;max-width:99px;white-space:normal;font-size:9px;line-height:1.3}.action-dock .dock-hint{max-width:61px;font-size:9px}.dock-photo{min-width:27px}.action-dock .start-board{display:none}}
/* Question marks take their own space; they never cover a clue digit. */
.guessed-number{display:inline-block;position:relative;padding:0}
.guessed-number sup{position:absolute;left:100%;top:-.1em;right:auto;margin-left:.05em;transform:none;font-size:.55em;line-height:1;width:auto;height:auto;background:transparent;color:#939b81;border:0;border-radius:0;pointer-events:none}
/* Frame inside the cell, in proportion to it: neighbouring targets do not overlap at any zoom. */
.cell button.correction-target{position:relative;z-index:1;box-shadow:inset 0 0 0 max(1px,calc(var(--cell)*.07)) #c56d36,inset 0 0 0 max(2px,calc(var(--cell)*.14)) #efb37c}
.cell button.correction-target:focus-visible{outline:2px solid #c56d36}
.board .correction-axis .clue-button{background:#fae7d4;color:#9c5428;box-shadow:inset 0 0 0 1px #e2ad7e}

.solution-card.complete #solution-ready{color:#2b654a;font-weight:600}

/* Shared application layout: the board owns remaining space on every screen. */
:root{--header-height:68px;--tap-size:44px;--surface:#fffef9;--safe-bottom:env(safe-area-inset-bottom,0px)}
.topbar{height:var(--header-height);padding:env(safe-area-inset-top,0px) 28px 0;gap:20px}
main{height:calc(100dvh - var(--header-height))}
.puzzle{padding:10px 28px max(10px,var(--safe-bottom));gap:6px}
.board-meta{height:32px}.board-viewport{padding:4px;touch-action:pan-x pan-y;scroll-padding:12px}
.board-stage{padding:8px;justify-content:safe center;align-items:safe center}
.solution-card{justify-content:flex-start;gap:12px;padding:12px 16px;border:1px solid #e0e5d7;border-radius:14px;background:#fcfcf7;min-height:74px}
.progress-summary{display:flex;align-items:center;gap:12px;min-width:0;flex:1}
.progress-summary strong{font-size:14px;line-height:1.4;font-weight:600;display:block;color:#4f654b}
.progress-summary p{font-size:11px;line-height:1.5;margin:3px 0 0;color:#89917e}
.progress-icon{display:grid;place-items:center;width:36px;height:36px;border-radius:50%;background:#edf0e5;color:#829075;font-size:22px;flex-shrink:0}
.solution-card[data-status=complete],.solution-card[data-status=correct]{background:#edf4e9;border-color:#d5e3cd}
.solution-card[data-status=complete] .progress-icon,.solution-card[data-status=correct] .progress-icon{background:#dcebd4;color:#2b6749}
.solution-card[data-status=conflict],.solution-card[data-status=clues]{background:#fff6e9;border-color:#eddabc}
.solution-card[data-status=conflict] .progress-icon,.solution-card[data-status=clues] .progress-icon{color:#ab7130;background:#f9e7ce}
.check-progress{width:44px;height:44px;font-size:24px;color:#77896c;border-radius:10px;flex-shrink:0}
.solution-peek{min-height:46px;flex-shrink:0;padding:6px 12px;font-size:11px;background:#fffef9;gap:10px}

.action-dock{position:static;transform:none;display:flex;max-width:100%;width:max-content;flex-shrink:0;margin:2px auto 0;padding:7px 10px;gap:16px;border-radius:16px;white-space:normal;box-shadow:0 5px 22px #4053320b}
.dock-tools,.dock-primary{display:flex;align-items:center;gap:6px}
.dock-primary{gap:8px}.dock-primary .primary{min-height:44px;min-width:145px;font-size:12px;padding:12px 18px;max-width:none;justify-content:center}
.tool-button{display:flex;align-items:center;justify-content:center;flex-direction:column;gap:1px;min-width:44px;min-height:44px;color:#778a6d;font-size:9px;border-radius:9px;padding:3px}
.tool-button svg{width:23px;height:23px;flex-shrink:0}
.paint-tools{padding:0;gap:0}.paint-tools button{width:44px;height:44px;font-size:25px}
.dock-quiet{width:44px;height:44px;padding:0;font-size:26px;border-radius:9px}
.dock-hint{min-height:44px;padding:10px 12px;font-size:12px;white-space:nowrap;max-width:none!important;border-radius:9px;background:#eff3e7}
.dock-hint>span:first-child{font-size:18px;margin-right:5px}.dock-hint>#hint-label{font-size:12px;margin:0;vertical-align:0;display:inline}
.solve-status{position:static;transform:none;margin:0 auto;max-width:100%;flex-shrink:0;box-shadow:none;padding:8px 14px;font-size:11px}
.settings-dialog{width:420px;max-width:calc(100vw - 28px);padding:22px;border-radius:20px}
.update-sheet h2{font-family:Georgia,"Times New Roman",serif;font-size:25px;font-weight:400;letter-spacing:-.6px;margin:8px 0}.update-sheet .button{display:flex;width:100%;min-height:48px;font-size:14px}.update-sheet .quiet{margin-top:6px}
.settings-dialog .panel-heading{margin-bottom:12px}.icon-button{width:44px;height:44px;font-size:26px}
.settings-list{display:flex;flex-direction:column}.settings-list>button{display:flex;align-items:center;gap:14px;text-align:left;min-height:74px;padding:12px 4px;border-top:1px solid #ecede5}
.settings-list>button>span:first-child{display:grid;place-items:center;width:36px;height:36px;color:#7d906e;font-size:26px;flex-shrink:0}
.settings-list>button>span:nth-child(2){flex:1}.settings-list>button>span:last-child{font-size:24px;color:#7d8a72}
.settings-list strong{font-size:14px;font-weight:500;display:block}.settings-list small{font-size:11px;line-height:1.5;display:block;color:#94a08b;margin-top:4px}
.settings-list .danger strong{color:#9e675a}
.size-form{display:grid;grid-template-columns:1fr 1fr;gap:16px}.size-form label{font-size:12px}.size-form input{width:100%;height:48px;font-size:18px;padding:10px}.size-form button{grid-column:1/-1;height:48px;font-size:13px}
.source-actions .quiet,.photo-toolbar button{min-height:44px}.source-panel .helper,.settings-dialog .helper{font-size:12px}
.photo-toolbar{justify-content:center}.photo-toolbar button{min-width:44px}.photo-viewer .helper{font-size:11px}
@media(max-width:760px){
  .topbar{padding-left:16px;padding-right:16px;gap:10px}.puzzle{padding-left:14px;padding-right:14px}
  .top-actions button{min-height:44px}.board-meta{gap:8px}.reconstruct-button{min-height:36px}
  .dock-tools,.dock-primary{gap:4px}.action-dock{gap:8px;padding:6px}
  .dock-quiet{width:36px}.paint-tools button{width:36px}.dock-primary .primary{min-width:125px;padding:12px}
}
@media(max-width:600px){
  :root{--header-height:calc(60px + env(safe-area-inset-top,0px))}
  .topbar{height:var(--header-height);gap:8px}.brand{font-size:25px;gap:8px}.brand-mark{width:24px;height:24px}
  .top-actions .quiet{font-size:10px}.top-actions .upload{font-size:11px;padding:9px 10px}
  .puzzle{padding:6px 10px max(8px,var(--safe-bottom));gap:5px}.board-meta{height:32px}.board-meta .review-status{font-size:9px;flex:1}.reconstruct-button{font-size:10px;padding:6px 8px}
  .solution-card{padding:10px;gap:5px;min-height:80px;border-radius:12px}.progress-summary{gap:8px;align-items:flex-start}.progress-icon{width:28px;height:28px;font-size:18px}
  .progress-summary strong{font-size:12px}.progress-summary p{font-size:10px;max-width:230px;line-height:1.4}
  .solution-peek{flex-direction:column;padding:5px 8px;gap:3px;min-width:67px;font-size:9px;min-height:54px}.solution-thumbnail{max-width:50px;max-height:26px}
  .check-progress{width:32px;min-width:32px;height:44px;font-size:22px}
  .board-stage{padding:6px}
  .action-dock{width:100%;max-width:440px;display:flex;flex-direction:column;gap:6px;padding:6px;border-radius:15px;margin-top:0}
  .dock-tools{width:100%;justify-content:space-between;gap:2px}.dock-primary{width:100%;display:grid;grid-template-columns:1fr 1fr;gap:6px}
  .paint-tools button,.dock-quiet{width:44px;height:44px}.tool-button{min-width:44px}.dock-primary .primary,.dock-hint{width:100%;min-width:0;max-width:none;font-size:12px;padding:12px 6px;min-height:44px;white-space:nowrap}
  .dock-hint>span:first-child{display:inline;font-size:17px}.dock-hint>#hint-label{display:inline;font-size:12px}
  dialog.settings-dialog,dialog.clue-editor,dialog.reconstruction-review{position:fixed;inset:auto 0 0;margin:0 auto;width:100%;max-width:100%;max-height:90dvh;border-radius:22px 22px 0 0;padding:20px 20px max(20px,var(--safe-bottom));border-bottom:0;overflow:auto}
  dialog.settings-dialog:before,dialog.clue-editor:before,dialog.reconstruction-review:before{content:'';display:block;width:34px;height:4px;background:#dfe4d6;border-radius:4px;margin:-8px auto 12px}
  .settings-list>button{min-height:72px}.settings-dialog .panel-heading h2{font-size:27px}.clue-editor input{font-size:18px;min-height:48px}.clue-editor .primary{min-height:48px}
  .source-panel{position:fixed;inset:auto 0 0;width:100%;max-width:100%;max-height:94dvh;border-radius:22px 22px 0 0;padding:20px 20px max(20px,var(--safe-bottom));z-index:8}
  .photo-viewer{position:fixed;inset:0;width:100%;max-width:100%;height:100dvh;max-height:100dvh;border:0;border-radius:0;padding:max(12px,env(safe-area-inset-top,0px)) 12px max(12px,var(--safe-bottom))}
  .photo-viewer .panel-heading h2{font-size:23px}.photo-viewer .photo-toolbar{gap:8px}
  .notification{top:calc(var(--header-height) + 8px);max-width:calc(100vw - 24px);font-size:12px}
}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}
.action-dock .paint-tools button{width:44px;min-width:44px;height:44px;flex-shrink:0}
/* Live reading: placeholders for unread clue lines, fade-in for new ones, progress bar on the status card. */
.clue-button.reading{pointer-events:none}.clue-placeholder{display:block;border-radius:4px;background:linear-gradient(90deg,#e9ece1 0%,#f6f7f0 50%,#e9ece1 100%);background-size:200% 100%;animation:clue-shimmer 1.3s ease-in-out infinite}
.row-clue .clue-placeholder{width:calc(var(--cell)*1.6);height:calc(var(--clue)*.8)}.col-clue .clue-placeholder{width:calc(var(--clue)*.8);height:calc(var(--cell)*1.6);margin:0 auto}
.clue-button.just-read{animation:clue-arrive .45s ease-out}
@keyframes clue-shimmer{from{background-position:100% 0}to{background-position:-100% 0}}@keyframes clue-arrive{from{opacity:0;transform:translateY(3px)}to{opacity:1;transform:none}}
.solution-card{position:relative;overflow:hidden}
/* No solution: the doubtful numbers turn red. */
.guessed-number.suspect-number{color:#c2412f;font-weight:700}.guessed-number.suspect-number sup{color:#c2412f}
/* The status bubble above the tools carries its own action (e.g. fixing a wrong mark). */
.solve-status:not([hidden]){display:flex;align-items:center;justify-content:center;gap:12px;flex-wrap:wrap}
.solve-status #solve-message{line-height:1.5}
.solve-status .button{font-size:11px;padding:7px 12px;flex-shrink:0;background:#fffdf7}

/* Compact layout: one status bar above the board, zoom floating over it. */
.solution-card{min-height:0;padding:6px 8px 6px 10px;gap:10px;border-radius:12px;align-items:center;flex-wrap:nowrap}
.progress-summary{gap:9px;align-items:center}
.progress-icon{width:26px;height:26px;font-size:15px}
.progress-text{display:flex;align-items:baseline;gap:8px;min-width:0}
.progress-summary strong{font-size:13px;line-height:1.3;white-space:nowrap}
#progress-detail{font-size:11px;line-height:1.3;color:#89917e;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.board-area{position:relative;flex:1;min-height:0;display:flex;flex-direction:column}
.board-area .board-viewport{flex:1;min-height:0}
@media(max-width:600px){
  .solution-card{padding:5px 6px 5px 8px;gap:6px;min-height:0}
  .progress-text{flex-direction:column;align-items:flex-start;gap:0}
  .progress-summary strong{font-size:12px}#progress-detail{font-size:10px;max-width:100%}
  }
/* Zoom submenu opens above its dock icon. */
.action-dock{position:relative;left:auto;bottom:auto}
.tool-button.zoomed{color:var(--green);background:#eef2e6}
.zoom-menu:not([hidden]){position:absolute;bottom:calc(100% + 10px);left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:2px;padding:4px;background:#fffef9;border:1px solid #e1e5d7;border-radius:12px;box-shadow:0 10px 30px #40533224;z-index:5}
.zoom-menu button{min-width:44px;height:40px;border-radius:8px;font-size:18px;color:#6f8064}
.zoom-menu #fit{min-width:72px;font-size:12px;font-variant-numeric:tabular-nums}
.zoom-menu button:hover{background:#eef2e6}
@media(max-width:600px){.dock-tools .tool-button,.dock-tools .dock-quiet{min-width:36px;padding-left:2px;padding-right:2px}.action-dock .paint-tools button{width:40px;min-width:40px}}
/* Status bubble floats over the board instead of taking layout space, so the
   board never jumps when a hint or a correction appears. */
.board-area .solve-status{position:absolute;left:50%;bottom:10px;top:auto;transform:translateX(-50%);z-index:3;width:max-content;max-width:calc(100% - 20px);margin:0;box-shadow:0 10px 30px #3a4a3024;animation:status-in .18s ease-out}
.board-area .solve-status.at-top{top:10px;bottom:auto}
.board-area .board-viewport{scroll-padding-bottom:84px}
@keyframes status-in{from{opacity:0;transform:translate(-50%,6px)}to{opacity:1;transform:translate(-50%,0)}}
/* ---------- Welcome page ---------- */
.welcome{position:relative;overflow:hidden;isolation:isolate;background:radial-gradient(120% 90% at 50% 38%,#fbfaf4 0%,#f4f3ea 55%,#ecefe2 100%)}
.welcome-field{position:absolute;inset:-2px;z-index:-1;display:grid;grid-template-columns:repeat(var(--cols),var(--cell));grid-auto-rows:var(--cell);
  background-image:linear-gradient(#dfe3d4 1px,transparent 1px),linear-gradient(90deg,#dfe3d4 1px,transparent 1px);background-size:var(--cell) var(--cell);opacity:.75;
  -webkit-mask-image:radial-gradient(ellipse 46% 52% at 50% 46%,transparent 0%,transparent 42%,#000 92%);mask-image:radial-gradient(ellipse 46% 52% at 50% 46%,transparent 0%,transparent 42%,#000 92%)}
.welcome-field>span{margin:3px;border-radius:4px}
.welcome-field>span.on{background:#6f8d61;opacity:0;animation:field-wave 11s ease-in-out var(--d) infinite}
@keyframes field-wave{0%,62%,100%{opacity:0;transform:scale(.7)}18%,40%{opacity:.34;transform:scale(1)}}
.welcome-hero{position:relative;display:flex;flex-direction:column;align-items:center;max-width:620px;animation:hero-in .7s cubic-bezier(.2,.7,.2,1) both}
@keyframes hero-in{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
.welcome h1{font-size:clamp(42px,5.4vw,74px);letter-spacing:-2.6px;margin:16px 0 14px;color:#253d33}
.welcome p{font-size:15px;line-height:1.7;color:#7f8875;margin:0 0 30px;max-width:520px}
.welcome .eyebrow{font-size:10px;letter-spacing:2.6px;color:#5a7151;background:#eef2e4;border:1px solid #dfe6d2;border-radius:999px;padding:6px 12px}
/* Self-solving mini nonogram */
.hero-board{--cell:20px;display:grid;grid-template-columns:auto repeat(var(--n),var(--cell));grid-auto-rows:var(--cell);gap:3px;align-items:end;justify-items:center;
  padding:14px 16px 16px 12px;margin-bottom:26px;background:#fffef9;border:1px solid #e0e5d6;border-radius:16px;box-shadow:0 18px 40px #3b4f3018,0 2px 0 #e6eadc;
  transform:rotate(-6deg);animation:board-float 7s ease-in-out infinite}
@keyframes board-float{0%,100%{transform:rotate(-6deg) translateY(0)}50%{transform:rotate(-4deg) translateY(-7px)}}
.hero-clue{font-size:9px;line-height:1.05;color:#8b9a7f;font-variant-numeric:tabular-nums;white-space:nowrap}
.hero-clue.col{writing-mode:vertical-rl;text-orientation:upright;letter-spacing:-1px;align-self:end;padding-bottom:2px}
.hero-clue.row{justify-self:end;align-self:center;padding-right:5px}
.hero-cell{width:var(--cell);height:var(--cell);border:1px solid #d9dfcd;border-radius:3px;background:#fbfcf6}
.hero-cell.on{animation:hero-fill 6.4s cubic-bezier(.3,.7,.3,1) infinite;animation-delay:calc(var(--i) * .07s)}
@keyframes hero-fill{0%,6%{background:#fbfcf6;border-color:#d9dfcd;transform:scale(1)}12%{background:#4f7a59;border-color:#4f7a59;transform:scale(1.12)}16%,80%{background:#3f6b4f;border-color:#3f6b4f;transform:scale(1)}92%,100%{background:#fbfcf6;border-color:#d9dfcd}}
/* Primary call to action */
.hero-cta{position:relative;display:inline-flex;align-items:center;gap:14px;padding:12px 30px 12px 12px;border-radius:999px;color:#fff;text-align:left;
  background:linear-gradient(135deg,#367457 0%,#245640 100%);box-shadow:0 14px 34px #295c4747,inset 0 1px 0 #ffffff2e;transition:transform .2s ease,box-shadow .2s ease}
.hero-cta:before{content:'';position:absolute;inset:-6px;border-radius:inherit;border:2px solid #6f9a74;opacity:0;animation:cta-pulse 2.8s ease-out infinite;pointer-events:none}
@keyframes cta-pulse{0%{opacity:.55;transform:scale(.96)}70%,100%{opacity:0;transform:scale(1.12)}}
.hero-cta:hover:enabled{filter:none;transform:translateY(-2px);box-shadow:0 18px 40px #295c4759,inset 0 1px 0 #ffffff2e}
.hero-cta:active:enabled{transform:translateY(0) scale(.98)}
.hero-cta-icon{display:grid;place-items:center;width:52px;height:52px;border-radius:50%;background:#ffffff22;flex-shrink:0}
.hero-cta-icon svg{width:26px;height:26px}
.hero-cta-text{display:flex;flex-direction:column;gap:2px}
.hero-cta-text strong{font-size:18px;font-weight:650;letter-spacing:-.2px}
.hero-cta-text small{font-size:11px;color:#d7e6d6;font-weight:450}
.welcome .file-help{font-size:11px;color:#9aa190;margin-top:16px}
@media(max-width:600px){
  .welcome{padding:18px 16px 26px}
  .welcome-field{-webkit-mask-image:radial-gradient(ellipse 70% 46% at 50% 46%,transparent 30%,#000 95%);mask-image:radial-gradient(ellipse 70% 46% at 50% 46%,transparent 30%,#000 95%)}
  .hero-board{--cell:15px;gap:2px;padding:10px 12px 12px 8px;margin-bottom:20px}
  .hero-clue{font-size:8px}
  .welcome h1{font-size:40px;letter-spacing:-1.6px}
  .welcome p{font-size:14px;margin-bottom:24px}
  .hero-cta{width:100%;max-width:330px;padding:10px 22px 10px 10px}
}
@media(max-height:720px) and (min-width:601px){.hero-board{--cell:15px;margin-bottom:16px}.welcome h1{margin:10px 0}.welcome p{margin-bottom:20px}}
@media(prefers-reduced-motion:reduce){.welcome-field>span.on{opacity:.18}.hero-cell.on{background:#3f6b4f;border-color:#3f6b4f}}
@media(hover:none) and (pointer:coarse){.welcome .file-help{display:none}}
/* ---------- Puzzle screen ---------- */
.puzzle{isolation:isolate;background:radial-gradient(120% 90% at 50% 40%,#fbfaf4 0%,#f4f3ea 60%,#edf0e3 100%)}
.puzzle:before{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;
  background-image:linear-gradient(#e3e6d8 1px,transparent 1px),linear-gradient(90deg,#e3e6d8 1px,transparent 1px);background-size:38px 38px;opacity:.55;
  -webkit-mask-image:radial-gradient(ellipse 60% 55% at 50% 50%,transparent 35%,#000 95%);mask-image:radial-gradient(ellipse 60% 55% at 50% 50%,transparent 35%,#000 95%)}
/* Status bar */
.solution-card{background:#fffef9d9;border:1px solid #e1e5d7;border-radius:14px;box-shadow:0 6px 20px #3b4f300d;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.solution-card[data-status=complete],.solution-card[data-status=correct]{background:#eef5eadd;border-color:#d3e3cb}
.solution-card[data-status=conflict],.solution-card[data-status=clues]{background:#fff6e9dd;border-color:#eddabc}
.progress-icon{box-shadow:inset 0 0 0 1px #00000008}
/* Paper sheet under the board */
.board-sheet{display:inline-block;padding:16px 18px 18px 12px;background:#fffef9;border:1px solid #e1e5d6;border-radius:18px;box-shadow:0 22px 50px #3b4f3016,0 2px 0 #e7ebdd}
.board .cell{background:#fffffb}
.cell button.filled,.cell button.filled:hover:enabled{background:#3f6b4f}
.cell button.empty{background:#f3f5ec;color:#a9b49d}
.board th{color:#4f5f47}
.corner-decoration{color:#b0b8a3;letter-spacing:1.4px}
/* Glass dock */
.action-dock{background:#fffef9d9;border:1px solid #e1e5d7;border-radius:20px;box-shadow:0 16px 40px #3b4f301c,inset 0 1px 0 #ffffffb0;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}
.action-dock .primary{background:linear-gradient(135deg,#367457 0%,#245640 100%);border-radius:12px;box-shadow:0 8px 20px #295c4733,inset 0 1px 0 #ffffff2a;transition:transform .15s ease,box-shadow .15s ease}
.action-dock .primary:hover:enabled{filter:none;transform:translateY(-1px);box-shadow:0 12px 26px #295c4740,inset 0 1px 0 #ffffff2a}
.action-dock .dock-hint{background:#eef3e6;border:1px solid #dfe7d4;border-radius:12px;color:#456140}
.action-dock .dock-hint:hover:enabled{background:#e6eddc;filter:none}
.paint-tools{background:#f1f4ea;border-radius:12px}
.paint-tools .active{border-radius:9px}
.board-area .solve-status{border-radius:14px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
@media(max-width:600px){.board-sheet{padding:10px 10px 12px 6px;border-radius:14px}.action-dock{border-radius:18px}}
/* Devices with side sensors or rounded corners (landscape iPhones, foldables). */
body{padding-left:env(safe-area-inset-left,0px);padding-right:env(safe-area-inset-right,0px)}
@media(max-width:760px){.welcome p br{display:none}}
/* Hint crosshair: the whole row and column of the hinted (or wrong) cell. */
.board td.cell.focus-line{background:#eef4e6}
.board td.cell.focus-line button:not(.filled){background:transparent}
.board th.focus-axis .clue-button{background:#e2ecd7;color:#2f5a40;box-shadow:inset 0 0 0 1px #c8d9ba}
.board:has(.correction-target) td.cell.focus-line{background:#fbf1e1}
.board:has(.correction-target) th.focus-axis .clue-button{background:#fae7d4;color:#9c5428;box-shadow:inset 0 0 0 1px #e9c29b}
.cell button.hinted{box-shadow:inset 0 0 0 2px #d3ad54,0 0 0 2px #f3e3b5}
/* Compact status pill: short text, details on hover. */
.board-area .solve-status{border-radius:999px;padding:7px 8px 7px 16px;font-size:12px;gap:10px;max-width:calc(100% - 24px)}
.board-area .solve-status:not(:has(#correction-apply:not([hidden]))){padding-right:16px}
.board-area .solve-status #solve-message{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.board-area .solve-status .button{border-radius:999px;padding:6px 12px;font-size:11px}
@media(max-width:600px){.board-area .solve-status{font-size:11px;flex-wrap:nowrap}.board-area .solve-status #solve-message{white-space:normal}}
/* Phone app links on the welcome page */
.get-app{display:flex;flex-direction:column;align-items:center;gap:10px;margin-top:34px}
.get-app-title{font-size:10px;letter-spacing:2px;text-transform:uppercase;color:#9aa190;font-weight:650}
.get-app-links{display:flex;gap:10px;flex-wrap:wrap;justify-content:center}
.store-badge{display:inline-flex;align-items:center;gap:10px;padding:8px 16px 8px 12px;border-radius:12px;border:1px solid #d9e1cf;background:#fffef9d9;color:#2f4a3a;text-align:left;transition:background .15s,border-color .15s,transform .15s}
.store-badge svg{width:22px;height:22px;flex-shrink:0}
.store-badge>span{display:flex;flex-direction:column;line-height:1.15}
.store-badge small{font-size:10px;color:#8a9580}
.store-badge strong{font-size:14px;font-weight:650;letter-spacing:-.1px}
a.store-badge:hover{background:#eef3e6;border-color:#c7d3ba;transform:translateY(-1px)}
.store-badge.is-soon{opacity:.62;cursor:default}
@media(max-width:600px){.get-app{margin-top:26px}.store-badge{padding:7px 12px 7px 10px}.store-badge strong{font-size:13px}}
/* Column clue highlight: breathing room above and below the digits without
   changing the header height (the plate is drawn outside the button box). */
.board th.col-clue.focus-axis .clue-button,.board th.col-clue.correction-axis .clue-button{background:none;box-shadow:none;isolation:isolate}
/* Hover is the same pill as a highlighted line, with room above and below the numbers. */
.board th.col-clue:not(.focus-axis,.correction-axis) .clue-button:hover:enabled,.board th.row-clue:not(.focus-axis,.correction-axis) .clue-button:hover:enabled{background:none;isolation:isolate}.board th.col-clue:not(.focus-axis,.correction-axis) .clue-button:hover:enabled:before,.board th.row-clue:not(.focus-axis,.correction-axis) .clue-button:hover:enabled:before{content:'';position:absolute;z-index:-1;border-radius:7px;background:#e5ebd9}.board th.col-clue:not(.focus-axis,.correction-axis) .clue-button:hover:enabled:before{inset:-5px 0}.board th.row-clue:not(.focus-axis,.correction-axis) .clue-button:hover:enabled:before{inset:0 -5px}
.board th.col-clue.focus-axis .clue-button:before,.board th.col-clue.correction-axis .clue-button:before{content:'';position:absolute;inset:-5px 0;z-index:-1;border-radius:7px;background:#e2ecd7;box-shadow:inset 0 0 0 1px #c8d9ba}
.board th.col-clue.correction-axis .clue-button:before,.board:has(.correction-target) th.col-clue.focus-axis .clue-button:before{background:#fae7d4;box-shadow:inset 0 0 0 1px #e9c29b}
.board th.row-clue.focus-axis .clue-button,.board th.row-clue.correction-axis .clue-button{background:none;box-shadow:none;isolation:isolate}
.board th.row-clue.focus-axis .clue-button:before,.board th.row-clue.correction-axis .clue-button:before{content:'';position:absolute;inset:0 -5px;z-index:-1;border-radius:7px;background:#e2ecd7;box-shadow:inset 0 0 0 1px #c8d9ba}
.board th.row-clue.correction-axis .clue-button:before,.board:has(.correction-target) th.row-clue.focus-axis .clue-button:before{background:#fae7d4;box-shadow:inset 0 0 0 1px #e9c29b}
/* Local-only switch between server and on-device processing (app.js). */
.processing-switch{margin-left:auto;display:flex;align-items:center;gap:2px;background:#f3f5ec;border-radius:9px;padding:3px;font-size:11px;flex-shrink:0}.processing-switch span{color:#a0a696;padding:0 7px 0 5px;font-size:9px;letter-spacing:1.5px;text-transform:uppercase}.processing-switch button{padding:6px 10px;border-radius:6px;color:#89967a}.processing-switch button[aria-pressed="true"]{background:#fff;color:var(--green);box-shadow:0 1px 4px #394d3014}
@media(max-width:600px){.processing-switch span{display:none}.processing-switch button{padding:6px 7px}}
@media(max-width:400px){.processing-switch{font-size:10px;padding:2px}.processing-switch button{padding:5px 5px}}
/* Adding a missed row or column right at the board, and per line in the clue editor. */
.board .add-line{padding:0;text-align:center;vertical-align:bottom}.add-line-button{box-sizing:border-box;flex:none;padding:0;width:clamp(26px,calc(var(--cell) - 4px),40px);height:clamp(26px,calc(var(--cell) - 4px),40px);border:1.5px dashed #a9b69a;border-radius:8px;color:#5f7353;font-size:clamp(17px,calc(var(--cell)*.6),24px);font-weight:500;line-height:1;display:inline-flex;align-items:center;justify-content:center;background:#fbfcf6;-webkit-appearance:none;appearance:none}.add-line-button:hover:enabled{background:#eef2e4;border-color:#8fa27f}.board .add-line.col-end{padding:0 0 10px 4px}.board .add-line.row-end{text-align:right;padding:4px 10px 0 0}
.line-tools{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}.line-tools .quiet{font-size:11px;background:#f1f3e9;padding:7px 10px}.line-tools .line-remove{color:#9e675a;margin-left:auto}
/* Release number next to the logo. */
.app-version{font-size:10px;line-height:1;color:#a6ad9b;letter-spacing:.2px;font-variant-numeric:tabular-nums;white-space:nowrap;margin-left:-12px;align-self:center;padding-top:8px}
@media(max-width:600px){.app-version{font-size:9px;margin-left:-4px}}
/* The on-device engine starting in the background (app.js, warmDevice); on phones only the spinner. */
.engine-status{display:flex;align-items:center;gap:6px;font-size:10px;line-height:1;color:#a6ad9b;white-space:nowrap;align-self:center;padding-top:8px;margin-left:-14px}.engine-status:before{content:'';width:8px;height:8px;border:1.5px solid #ccd7bf;border-top-color:var(--green);border-radius:50%;animation:spin 1s linear infinite;flex-shrink:0}
@media(max-width:600px){.engine-status{margin-left:-6px}.engine-status>span{position:absolute;width:1px;height:1px;clip-path:inset(50%);overflow:hidden}}
/* Photo reading: a small scene over the photo and the step icons, so the wait shows what is happening. */
@property --read-progress{syntax:'<percentage>';inherits:true;initial-value:0%}
.loader{position:absolute;inset:0;z-index:15;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:26px;padding:24px 16px;text-align:center;overflow:auto;background:radial-gradient(120% 90% at 50% 38%,#fbfaf4 0%,#f4f3ea 55%,#ecefe2 100%);animation:loader-in .45s cubic-bezier(.2,.7,.2,1) both}
@keyframes loader-in{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.loader-photo{position:relative;flex-shrink:0;width:min(252px,58vw);aspect-ratio:1;border-radius:22px;overflow:hidden;background:#eef1e6;border:4px solid #fffef9;box-shadow:0 26px 60px #2f4a3a2e,0 0 0 1px #dfe4d5;animation:loader-float 6s ease-in-out infinite}
@keyframes loader-float{0%,100%{transform:rotate(-3deg) translateY(0)}50%{transform:rotate(-1.5deg) translateY(-7px)}}
.loader-scene{position:absolute;inset:0;width:100%;height:100%;display:block;animation:photo-develop 1.1s ease both}
@keyframes photo-develop{from{opacity:0;filter:blur(10px) saturate(0);transform:scale(1.08)}to{opacity:1;filter:none;transform:none}}
.loader:not(.has-photo) .loader-scene{display:none}
.loader-placeholder{position:absolute;inset:0;display:grid;place-items:center;color:#9fb08f;background:linear-gradient(90deg,#dfe4d5 1px,transparent 0) 0 0/20% 20%,linear-gradient(#dfe4d5 1px,transparent 0) 0 0/20% 20%,#f3f5ec}
.loader-placeholder svg{width:58px;height:58px;padding:12px;border-radius:50%;background:#fffef9;box-shadow:0 8px 24px #2f4a3a1f;animation:shutter 1.6s ease-in-out infinite}
@keyframes shutter{0%,100%{transform:scale(1)}45%{transform:scale(.88)}55%{transform:scale(1.06);color:var(--green)}}
.loader.has-photo .loader-placeholder{display:none}
/* Corner brackets that hunt for the puzzle, then lock onto it. */
.loader-frame{position:absolute;inset:14%;opacity:0;border-radius:6px;box-shadow:0 0 0 999px #1e332840;transition:opacity .4s,inset .6s cubic-bezier(.3,.8,.3,1);
  --c:#fff;background:linear-gradient(var(--c),var(--c)) top left/22px 3px,linear-gradient(var(--c),var(--c)) top left/3px 22px,linear-gradient(var(--c),var(--c)) top right/22px 3px,linear-gradient(var(--c),var(--c)) top right/3px 22px,linear-gradient(var(--c),var(--c)) bottom left/22px 3px,linear-gradient(var(--c),var(--c)) bottom left/3px 22px,linear-gradient(var(--c),var(--c)) bottom right/22px 3px,linear-gradient(var(--c),var(--c)) bottom right/3px 22px;background-repeat:no-repeat;filter:drop-shadow(0 1px 3px #0004)}
.loader[data-step=find] .loader-frame{opacity:1}
.loader[data-step=find] .loader-frame{animation:frame-hunt 3.4s ease-in-out infinite alternate}
@keyframes frame-hunt{0%{inset:10% 38% 42% 8%}30%{inset:34% 8% 10% 36%}60%{inset:20% 22% 28% 16%}100%{inset:12% 12% 14% 14%}}
.loader-beam{position:absolute;left:0;right:0;top:-30%;height:30%;opacity:0;pointer-events:none;background:linear-gradient(#a8dcb000,#a8dcb04d 80%,#f2fff0 calc(100% - 2px),#f2fff000);mix-blend-mode:screen}
.loader[data-step=find] .loader-beam{opacity:1;animation:beam 2.2s cubic-bezier(.45,0,.55,1) infinite}
@keyframes beam{from{top:-30%}to{top:100%}}
/* Step icons: done ones are ticked, the current one moves. */
.loader-steps,.progress-steps{display:flex;align-items:flex-start;list-style:none;margin:0;padding:0}
.loader-steps li{--size:40px;position:relative;display:flex;flex-direction:column;align-items:center;gap:7px;width:62px}
.loader-steps li+li:before,.progress-steps li+li:before{content:'';position:absolute;top:calc(var(--size)/2 - 1px);right:calc(50% + var(--size)/2 + 4px);left:calc(-50% + var(--size)/2 + 4px);height:2px;border-radius:2px;background:#dfe4d5}
.loader-steps li:is([data-state=done],[data-state=active])+li:before,.progress-steps li:is([data-state=done],[data-state=active])+li:before{background:linear-gradient(90deg,#7f9a6d 50%,#dfe4d5 0) 100% 0/200% 100%}
.loader-steps li[data-state=done]+li:before,.progress-steps li[data-state=done]+li:before{background:#7f9a6d}
.loader-steps li[data-state=active]+li:before{animation:connector 1.6s ease-in-out infinite}
@keyframes connector{from{background-position:100% 0}to{background-position:0 0}}
.step-icon{position:relative;display:grid;place-items:center;width:var(--size);height:var(--size);border-radius:50%;background:#fffef9;border:1.5px solid #dfe4d5;color:#adb5a1;transition:background .35s,border-color .35s,color .35s,transform .35s}
.step-icon svg{width:50%;height:50%;overflow:visible}
.loader-steps small{font-size:10px;font-weight:650;letter-spacing:.2px;color:#a7ae9b;transition:color .35s}
[data-state=done] .step-icon{background:#e5efdd;border-color:#c7dab9;color:#3f6b4f}
[data-state=done] .step-icon:after{content:'✓';position:absolute;right:-4px;top:-4px;display:grid;place-items:center;width:15px;height:15px;border-radius:50%;background:#3f6b4f;color:#fff;font-size:9px;font-weight:800;box-shadow:0 0 0 2px #f6f5ef;animation:tick-in .4s cubic-bezier(.3,1.6,.5,1) both}
@keyframes tick-in{from{transform:scale(0)}to{transform:scale(1)}}
[data-state=done] small{color:#6f8a64}
[data-state=active] .step-icon{background:var(--green);border-color:var(--green);color:#fff;transform:scale(1.08);box-shadow:0 8px 20px #295c4740}
[data-state=active] .step-icon:before{content:'';position:absolute;inset:-6px;border-radius:50%;border:2px solid #7f9a6d;animation:cta-pulse 1.8s ease-out infinite}
[data-state=active] small{color:var(--green)}
[data-step=open][data-state=active] svg{animation:shutter 1.4s ease-in-out infinite}
[data-step=find][data-state=active] svg,[data-step=verify][data-state=active] svg{animation:magnify 2s ease-in-out infinite}
@keyframes magnify{0%,100%{transform:translate(0,0) rotate(0)}25%{transform:translate(-2px,-1px) rotate(-8deg)}50%{transform:translate(2px,1px) rotate(4deg)}75%{transform:translate(1px,-2px) rotate(8deg)}}
[data-step=grid][data-state=active] svg{animation:grid-tilt 2.4s ease-in-out infinite}
@keyframes grid-tilt{0%,100%{transform:perspective(40px) rotateX(0)}50%{transform:perspective(40px) rotateX(18deg) scale(.92)}}
[data-step=read][data-state=active] svg{animation:bob .9s ease-in-out infinite alternate}
@keyframes bob{from{transform:translateY(1.5px)}to{transform:translateY(-1.5px)}}
[data-step=solve][data-state=active] svg{animation:twinkle 1.8s ease-in-out infinite}
@keyframes twinkle{0%,100%{transform:rotate(0) scale(1)}50%{transform:rotate(18deg) scale(1.15)}}
.loader-text{display:flex;flex-direction:column;align-items:center;gap:6px;min-height:58px}
.loader-text strong{font-family:Georgia,"Times New Roman",serif;font-size:28px;font-weight:400;letter-spacing:-.8px;color:#253d33}
.loader-text span{font-size:13px;line-height:1.5;color:#7f8875;max-width:360px}
.loader-fact{max-width:380px;margin:0;padding:11px 16px;font-size:12px;line-height:1.55;color:#7c8771;background:#fffef9b3;border:1px solid #e3e7da;border-radius:14px;opacity:0}
.loader-fact:before{content:var(--loader-fact-label,'✧ Пока ждём: ');font-weight:650;color:#5f7d55}
.loader-fact.in{animation:fact-in 5.2s ease both}
@keyframes fact-in{0%{opacity:0;transform:translateY(6px)}10%,88%{opacity:1;transform:none}100%{opacity:0;transform:translateY(-4px)}}
@media(max-width:600px){
  .loader{gap:20px}.loader-steps li{--size:34px;width:52px}.loader-steps small{font-size:9px}
  .loader-text strong{font-size:23px}.loader-text span{font-size:12px}.loader-fact{font-size:11px}
}
/* The card above the board carries the same steps once the grid is on screen. */
.solution-card{transition:--read-progress .5s ease}
.progress-steps{flex-shrink:0;margin-left:auto}
.progress-steps li{--size:22px;position:relative;width:30px;display:flex;justify-content:center}
.progress-steps small{display:none}
.progress-steps .step-icon{border-width:1px}
.progress-steps [data-state=done] .step-icon:after{display:none}
.progress-steps [data-state=active] .step-icon{transform:none;box-shadow:0 3px 10px #295c4733}
.progress-steps [data-state=active] .step-icon:before{inset:-4px;border-width:1.5px}
.solution-card:is([data-stage=read],[data-stage=verify],[data-stage=solve]) .progress-icon{position:relative;color:var(--green);background:radial-gradient(closest-side,#edf0e5 calc(100% - 3px),transparent calc(100% - 2px)),conic-gradient(var(--green) var(--read-progress),#dfe6d4 0)}
.solution-card[data-stage=solve] .progress-icon{background:#edf0e5}
.solution-card[data-stage=solve] .progress-icon:before{content:'';position:absolute;inset:0;border-radius:50%;border:2px solid #dfe6d4;border-top-color:var(--green);animation:spin 1s linear infinite}
.solution-card[data-stage] .progress-icon svg{width:58%;height:58%}
.solution-card[data-stage=read] .progress-icon svg{animation:bob .9s ease-in-out infinite alternate}
.solution-card:is([data-stage=verify]) .progress-icon svg{animation:magnify 2s ease-in-out infinite}
.solution-card[data-stage=solve] .progress-icon svg{animation:twinkle 1.8s ease-in-out infinite}
@media(max-width:600px){.progress-steps li{width:24px;--size:18px}.progress-steps li:is([data-step=open],[data-step=find]){display:none}}
@media(prefers-reduced-motion:reduce){.loader,.loader *,.progress-steps *,.solution-card .progress-icon,.solution-card .progress-icon *{animation:none!important}.loader-beam{display:none}.loader-fact{opacity:1}}
/* Loader backdrop: the same field of cells as the welcome page; from the grid on, the board itself shows through, softly blurred. */
.loader{background:none;isolation:isolate;-webkit-backdrop-filter:blur(0);backdrop-filter:blur(0);transition:-webkit-backdrop-filter 1s ease,backdrop-filter 1s ease}
.loader:before,.loader:after{content:'';position:absolute;inset:0;z-index:-2;pointer-events:none;transition:opacity 1.1s cubic-bezier(.4,0,.2,1)}
.loader:before{background:radial-gradient(120% 90% at 50% 38%,#fbfaf4 0%,#f4f3ea 55%,#ecefe2 100%)}
.loader:after{opacity:0;background:radial-gradient(46% 50% at 50% 52%,#f8f7f1d9 0%,#f6f5ef99 55%,#f2f3e933 100%)}
.loader-field{inset:0;pointer-events:none;transition:opacity 1.1s ease;-webkit-mask-image:radial-gradient(ellipse 58% 52% at 50% 48%,transparent 28%,#000 92%);mask-image:radial-gradient(ellipse 58% 52% at 50% 48%,transparent 28%,#000 92%)}
.loader.over-board{-webkit-backdrop-filter:blur(3.5px) saturate(1.1);backdrop-filter:blur(3.5px) saturate(1.1)}
.loader.over-board:before{opacity:0}
.loader.over-board:after{opacity:1}
.loader.over-board .loader-field{opacity:.22}
.loader.over-board .loader-fact{background:#fffef9d9}
/* The board draws itself in from the corner where the numbers start. */
.puzzle.emerging .board-sheet{animation:board-emerge 1.5s cubic-bezier(.3,.7,.2,1) both}
@keyframes board-emerge{from{opacity:0;clip-path:inset(0 100% 100% 0 round 18px)}35%{opacity:1}to{opacity:1;clip-path:inset(0 0 0 0 round 18px)}}
/* The photo scene: the camera moves in on the field that was found, its real grid is drawn,
   each line lights up as it is read, and the solved picture appears on the paper at the end. */
.loader-scene image{filter:saturate(.82) contrast(1.02);transition:filter 1.2s ease}
.loader:is([data-step=grid],[data-step=read],[data-step=verify],[data-step=solve]) .loader-scene image{filter:saturate(.55) brightness(.86)}
.scene-camera{transform-origin:0 0;transition:transform 1.5s cubic-bezier(.5,0,.15,1)}
.scene-grid path{fill:none;stroke:#fffef9;stroke-width:.6;opacity:.3;stroke-dasharray:1;stroke-dashoffset:1;animation:line-draw .7s cubic-bezier(.5,0,.2,1) var(--d) forwards}
.scene-grid path.major{stroke-width:1.3;opacity:.9;filter:drop-shadow(0 0 1.5px #0006)}
.scene-grid .outline{fill:#a8dcb00f;stroke:#fffef9;stroke-width:2;stroke-dasharray:none;stroke-dashoffset:0;opacity:1;filter:drop-shadow(0 0 3px #a8dcb0b3);animation:outline-in .8s ease both}
@keyframes line-draw{to{stroke-dashoffset:0}}
@keyframes outline-in{from{opacity:0}}
.scene-reads polygon{fill:#4fae74;opacity:.2;animation:line-read 1.1s ease-out both}
@keyframes line-read{0%{opacity:0;fill:#d9ffe2}15%{opacity:.85;fill:#c4f5d0}100%{opacity:.2;fill:#4fae74}}
.scene-reads{transition:opacity .8s}
.loader:is([data-step=verify],[data-step=solve],[data-step=done]) .scene-reads{opacity:0}
.loader[data-step=verify] .scene-grid .outline{animation:outline-check 1.6s ease-in-out infinite}
@keyframes outline-check{0%,100%{fill:#a8dcb00f}50%{fill:#a8dcb040}}
.loader[data-step=solve] .loader-photo:after{z-index:1;content:'';position:absolute;inset:0;background:linear-gradient(115deg,transparent 35%,#ffffff8c 50%,transparent 65%) 0 0/250% 100%;mix-blend-mode:soft-light;animation:sheen 1.8s ease-in-out infinite}
@keyframes sheen{from{background-position:100% 0}to{background-position:-50% 0}}
.loader[data-step=done] .loader-photo{animation:loader-float 6s ease-in-out infinite,done-glow .9s ease-out both}
@keyframes done-glow{from{box-shadow:0 26px 60px #2f4a3a2e,0 0 0 1px #dfe4d5,0 0 0 0 #7f9a6d66}to{box-shadow:0 26px 60px #2f4a3a2e,0 0 0 1px #dfe4d5,0 0 0 18px #7f9a6d00}}
.loader[data-step=done] .loader-text strong{animation:title-in .5s cubic-bezier(.2,.7,.2,1) both}
@keyframes title-in{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:none}}
/* Stepping aside: the veil lifts and the board comes into focus. */
.loader.leaving{pointer-events:none;animation:loader-out .7s cubic-bezier(.4,0,.2,1) both}
@keyframes loader-out{to{opacity:0;transform:scale(1.015);-webkit-backdrop-filter:blur(0);backdrop-filter:blur(0)}}
@media(prefers-reduced-motion:reduce){.puzzle.emerging .board-sheet{animation:none}}
.loader[data-step=done] .loader-fact{animation:none;opacity:0;transition:opacity .3s}
@media(prefers-reduced-motion:reduce){.scene-grid path{stroke-dashoffset:0}.scene-camera{transition:none}}
/* Several boards on one photo: the camera shows them all; each is outlined like the grid it
   will become and can be tapped on the photo or picked from the chips below. */
.loader-photo{transition:width .6s cubic-bezier(.3,.8,.3,1)}
.loader-frame{pointer-events:none}
.loader[data-step=choose] .loader-photo{width:min(340px,78vw)}
.loader[data-step=choose] .loader-scene image{filter:saturate(.6) brightness(.9)}
.loader[data-step=choose] .loader-fact{display:none}
.scene-choices .choice{cursor:pointer;transition:opacity .4s ease}
.scene-choices polygon{fill:#a8dcb024;stroke:#fffef9;stroke-width:2;filter:drop-shadow(0 0 3px #a8dcb0b3);transition:fill .25s,stroke-width .25s;animation:outline-in .8s ease var(--d) both}
.scene-choices circle{fill:var(--green);stroke:#fffef9;stroke-width:2;vector-effect:non-scaling-stroke;filter:drop-shadow(0 2px 4px #0005);animation:choice-badge .5s cubic-bezier(.3,1.6,.5,1) calc(var(--d) + .2s) both;transform-box:fill-box;transform-origin:center}
.scene-choices text{fill:#fff;font-weight:750;font-family:Inter,-apple-system,sans-serif;pointer-events:none;animation:choice-badge .5s cubic-bezier(.3,1.6,.5,1) calc(var(--d) + .2s) both;transform-box:fill-box;transform-origin:center}
.scene-choices .hot polygon,.scene-choices .chosen polygon{fill:#a8dcb055;stroke-width:3.5}
.scene-choices .dismissed{opacity:0}
@keyframes choice-badge{from{opacity:0;transform:scale(.4)}to{opacity:1;transform:none}}
.loader-choices{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:10px;max-width:min(580px,100%)}
.choice-chip{display:flex;align-items:center;gap:11px;min-height:60px;padding:7px 16px 7px 7px;border-radius:16px;background:#fffef9;border:1px solid #e0e5d6;box-shadow:0 6px 18px #2f4a3a14;text-align:left;transition:transform .2s,border-color .2s,box-shadow .2s;animation:chip-in .45s cubic-bezier(.2,.7,.2,1) both}
.choice-chip:nth-child(2){animation-delay:.08s}.choice-chip:nth-child(3){animation-delay:.16s}.choice-chip:nth-child(n+4){animation-delay:.24s}
.choice-chip img{width:46px;height:46px;object-fit:cover;border-radius:10px;background:#eef1e6}
.choice-chip strong{display:block;font-size:13px;font-weight:650;color:#253d33}
.choice-chip small{font-size:11px;color:#8b9580}
.choice-chip.hot{border-color:#7f9a6d;transform:translateY(-2px);box-shadow:0 10px 24px #2f4a3a24}
.choice-other{min-height:44px;padding:9px 12px;animation:chip-in .45s cubic-bezier(.2,.7,.2,1) .3s both}
@media(max-width:600px){.loader-choices{flex-direction:column;align-items:stretch;width:100%;max-width:330px;gap:8px}.choice-other{align-self:center}}
@keyframes chip-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){.scene-choices *,.choice-chip,.choice-other{animation:none!important}}

/* Dock: every tool carries its caption; «Ошибки» shows what the background check found. */
.action-dock .paint-tools button,.action-dock .dock-quiet,.action-dock .tool-button{flex-direction:column;justify-content:center;gap:4px;width:auto;min-width:52px;height:54px;padding:5px 6px}
.tool-caption{display:block;font-size:10px;line-height:1;font-weight:500;letter-spacing:.1px;color:inherit;white-space:nowrap}
.tool-glyph{display:block;font-size:22px;line-height:20px;height:20px}
.action-dock .tool-button svg{width:21px;height:21px}
.action-dock .paint-tools .paint-square{width:13px;height:13px;margin:4px 0 3px}
.action-dock .dock-hint,.action-dock .dock-primary .primary{min-height:54px}
.errors-button{position:relative}
.errors-button.has-errors{color:#a2652f;background:#fbf1e1;box-shadow:inset 0 0 0 1px #efd7b3}
.errors-button[aria-pressed=true]{color:#8c5323;background:#f6e2c4;box-shadow:inset 0 0 0 1px #e6c391}
.errors-count{position:absolute;top:3px;right:5px;min-width:16px;height:16px;padding:0 4px;border-radius:8px;background:#c56d36;color:#fff;font-size:10px;font-weight:650;line-height:16px;text-align:center;font-variant-numeric:tabular-nums}
.solve-status.error .quiet{color:#9c743b;font-size:11px;padding:6px 8px;border-radius:999px}
.solve-status #errors-fix{background:var(--green);border:1px solid var(--green);color:#fff}
@media(max-width:600px){
  .tool-caption{display:none}
  .action-dock .paint-tools button,.action-dock .dock-quiet,.action-dock .tool-button{min-width:36px;height:44px;padding:2px}
  .action-dock .dock-hint,.action-dock .dock-primary .primary{min-height:44px}
  .errors-count{top:1px;right:0}
}

/* A newer release on the server: a quiet link next to the version. */
.app-update{font-size:10px;line-height:1;color:#6a8f5c;align-self:center;padding:8px 0 0;margin-left:-14px;text-decoration:underline dotted #a9c09b;text-underline-offset:3px;white-space:nowrap}
.app-update:before{content:'·';color:#b4baa8;margin-right:5px;display:inline-block;text-decoration:none}
@media(max-width:600px){.app-update{font-size:9px;margin-left:-6px}}

/* Photo viewer: title and zoom in one row, the photo centred on a soft field. */
.photo-header{display:flex;align-items:center;gap:16px;flex-shrink:0;margin-bottom:14px}
.photo-heading{min-width:0}
.photo-heading h2{font-family:Georgia,"Times New Roman",serif;font-size:26px;font-weight:400;letter-spacing:-.6px;margin:0;line-height:1.15}
.photo-subtitle{margin:4px 0 0;font-size:11px;color:#98a08c;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.photo-subtitle:empty{display:none}
.photo-viewer .photo-toolbar{margin-left:auto;display:flex;align-items:center;justify-content:flex-end;gap:8px}
.photo-zoom{display:flex;align-items:center;background:#f1f3ea;border-radius:999px;padding:3px}
.photo-viewer .photo-zoom button{width:38px;height:38px;min-width:38px;min-height:38px;padding:0;border-radius:50%;background:#fffef9;border:1px solid #e3e7da;color:#4e6a47;font-size:18px;line-height:1;display:grid;place-items:center}
.photo-level{min-width:54px;text-align:center;font-size:12px;font-weight:550;color:#5f7353;font-variant-numeric:tabular-nums}
.photo-viewer .photo-fit{display:flex;align-items:center;gap:6px;min-height:44px;padding:0 15px;border-radius:999px;background:#f1f3ea;color:#5f7353;font-size:12px;font-weight:550}
.photo-fit svg{width:16px;height:16px}
.photo-viewport{position:relative;border-radius:14px;background:#eef0e7;outline:none}
.photo-stage{min-width:100%;min-height:100%;width:max-content;display:flex;align-items:center;justify-content:center;padding:12px}
.photo-viewport .photo-stage img{margin:0;border-radius:4px;box-shadow:0 8px 28px #34422c24}
.photo-context{flex-shrink:0;margin:10px 0 0;font-size:11px;line-height:1.5;color:#98a08c;text-align:center}
@media(max-width:600px){
  .photo-header{flex-wrap:wrap;gap:10px;margin-bottom:10px}
  .photo-heading{flex:1}
  .photo-heading h2{font-size:22px}
  .photo-viewer .photo-toolbar{width:100%;justify-content:space-between;margin-left:0}
}

/* Clue editor: the crop with «Всё фото», input and save; line actions below in one row. */
.clue-subtitle{margin:3px 0 0;font-size:11px;color:#98a08c}
.clue-media{position:relative;margin:14px 0 2px}
.clue-media .clue-crop-wrap{margin:0;border-radius:12px}
.clue-photo{display:inline-flex;align-items:center;gap:6px;min-height:32px;padding:6px 11px;border-radius:999px;background:#fffef9;border:1px solid #e3e7da;color:#5f7353;font-size:11px;font-weight:550}
.clue-photo svg{width:15px;height:15px}
.clue-crop-wrap:not([hidden])+.clue-photo{position:absolute;right:8px;bottom:8px;box-shadow:0 2px 8px #34422c14}
.clue-editor .line-tools{display:flex;align-items:center;flex-wrap:nowrap;gap:6px;margin-top:14px;padding-top:12px;border-top:1px solid #e9ece2}
.line-label{font-size:12px;color:#77836f;margin-right:2px;white-space:nowrap}
.clue-editor .line-tools button{min-height:36px;padding:7px 12px;border-radius:999px;background:#f1f3ea;color:#5f7353;font-size:12px;white-space:nowrap}
.clue-editor .line-tools .line-remove{margin-left:auto;width:36px;padding:0;display:grid;place-items:center;background:transparent;color:#9e675a}
.clue-editor .line-tools .line-remove:hover:enabled{background:#f8ece7;filter:none}
.line-remove svg{width:19px;height:19px}

/* Settings: how the on-device engine runs, for telling us what is slow. */
.settings-engine{margin:14px 2px 0;font-size:11px;line-height:1.5;color:#98a08c}
/* Difficulty under the status line (docs/roadmap/mockups/e1-scan) */
.solution-card:has(.difficulty:not([hidden])){flex-wrap:wrap}
.difficulty{flex-basis:100%;display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;margin-top:2px;padding-top:8px;border-top:1px solid #ebeee3}
.difficulty-tier{display:flex;gap:3px}
.difficulty-tier i{width:11px;height:11px;border-radius:2px;background:#e4e9da}
.difficulty-tier i.on{background:var(--green)}
#difficulty-name{font-size:13px;font-weight:700;color:var(--green)}
#difficulty-meta{font-size:12px;color:#5f6b57}
.difficulty-techniques{flex-basis:100%;list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:6px}
.difficulty-techniques li{font-size:11px;line-height:1.4;padding:2px 8px;border-radius:999px;background:#eef2e4;color:#4f6b45}
.difficulty-techniques li.hard{background:#fbefdc;color:#8f5a1b}
.difficulty-why{margin-left:auto;font-size:12px;font-weight:600;color:var(--green);padding:4px 2px}
.difficulty-reason{flex-basis:100%;margin:0;font-size:12px;line-height:1.45;color:#4f5f47}
/* Next move with an explanation (docs/roadmap/mockups/e1-hint, d-play) */
.board-area .hint-card{position:absolute;left:50%;bottom:10px;transform:translateX(-50%);z-index:4;width:min(420px,calc(100% - 20px));box-sizing:border-box;display:flex;flex-direction:column;gap:10px;padding:14px 16px;border-radius:20px;background:#fffef9;border:1px solid #e1e5d7;box-shadow:0 -6px 40px #3b4f3024;animation:status-in .18s ease-out}
.hint-card[hidden]{display:none}
.hint-head{display:flex;align-items:center;gap:8px}
.hint-icon{flex:none;width:28px;height:28px;border-radius:50%;background:#eef2e4;color:var(--green);display:grid;place-items:center}
.hint-icon svg{width:15px;height:15px}
#hint-title{font-size:14px;font-weight:650;color:#30453b}
#hint-text{margin:0;font-size:13px;line-height:1.5;color:#4f5f47}
.hint-diagram{display:flex;flex-direction:column;gap:3px}
.hint-diagram-row{display:grid;grid-template-columns:repeat(var(--cells),minmax(0,1fr));gap:2px}
.hint-diagram-row span{height:11px;border-radius:2px;background:#eceee6}
.hint-diagram-row span.covered{background:#b9cdb0}
.hint-diagram-row span.known{background:#7d9a86}
.hint-diagram-row span.new{background:var(--green)}
.hint-diagram-row span.cross{background:#f6f5ef;box-shadow:inset 0 0 0 1px #dcded3}
.hint-diagram-row span.new-cross{background:#fbefdc;box-shadow:inset 0 0 0 1px #e6cfa8}
.hint-diagram-legend{font-size:11px;color:#65715b}
.hint-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.hint-actions .button{min-height:42px;font-size:13px;padding:10px 12px;white-space:normal;line-height:1.25;text-align:center}
.board td.cell button.suggest-fill:not(.filled){background:#9fcb8e}
.board td.cell button.suggest-cross:not(.filled){background:#fbefdc}
.cell button.suggest-cross:before,.cell button.suggest-cross:after{content:'';position:absolute;left:50%;top:50%;width:46%;height:max(1px,calc(var(--cell)*.075));background:#c98a2e;border-radius:1px;transform:translate(-50%,-50%) rotate(45deg)}
.cell button.suggest-cross:after{transform:translate(-50%,-50%) rotate(-45deg)}
.board th.row-clue.hint-line .clue-button,.board th.col-clue.hint-line .clue-button{color:#fff}
.board th.row-clue.hint-line .clue-button:before,.board th.col-clue.hint-line .clue-button:before{background:var(--green);box-shadow:none}
/* New field without a photo (docs/roadmap/mockups/e1-new) */
.welcome-new{display:inline-flex;align-items:center;gap:8px;margin-top:14px;padding:10px 18px;border-radius:999px;border:1px solid #d7ddcf;background:#fffdf7;color:#4f6b45;font-size:14px;font-weight:600}
.welcome-new svg{width:18px;height:18px}
/* Drawing a picture (docs/roadmap/mockups/e1-draw) */
.draw-panel{flex-shrink:0;margin:8px 0 0;padding:2px 14px;border-radius:14px;background:#fffef9eb;border:1px solid #e1e5d7;display:flex;flex-direction:column}
.draw-panel[hidden]{display:none}
.draw-row{display:flex;gap:10px;align-items:center;padding:8px 0;border-bottom:1px solid #ebeee3;font-size:13px;color:#30453b}
.draw-row:last-child{border-bottom:0}
.draw-mark{flex:none;width:22px;height:22px;border-radius:50%;background:#e3eedb;color:var(--green);display:grid;place-items:center;font-size:12px;font-weight:800}
.draw-mark.warn{background:#fbefdc;color:#a8641a}
.draw-mark.wait{background:#eef1e6;color:#65715b}
.draw-status-body{display:flex;flex-direction:column;gap:8px;min-width:0}
.draw-actions{display:flex;flex-wrap:wrap;gap:8px}
.draw-actions[hidden]{display:none}
.draw-fix,.draw-other{min-height:34px;padding:0 14px;border-radius:999px;font-size:13px;font-weight:600}
.draw-fix{background:#c98a2e;color:#fff}
.draw-other{border:1px solid #e6cfa8;background:#fffaf1;color:#8f5a1b}
.draw-other[aria-pressed=true]{background:#fbefdc}
#draw-level{font-size:13px}
.puzzle.drawing #cross,.puzzle.drawing #hint,.puzzle.drawing #solve{display:none}
.board td.cell button.ambiguous{box-shadow:inset 0 0 0 2px #c98a2e}
.board td.cell button.ambiguous:not(.filled){background:#fbefdc}
.board td.cell button.ambiguous.filled{background:#c98a2e}

.puzzle.drawing .dock-primary .draw-play{grid-column:1/-1;width:100%;flex:1}
#draw-status-row{align-items:flex-start}
/* App shell: sections and navigation (docs/roadmap/mockups: Main, d-today, e2-sets) */
:root{--tabbar-height:0px}
body.with-tabs{--tabbar-height:calc(64px + var(--safe-bottom,0px))}
main{height:calc(100dvh - var(--header-height,84px) - var(--tabbar-height))}
.view{height:100%;overflow:auto;padding:28px 20px 40px;box-sizing:border-box}
.view[hidden]{display:none}
.view-inner{max-width:1040px;margin:0 auto;display:flex;flex-direction:column;gap:18px}
.view-eyebrow{align-self:flex-start;font-size:10px;font-weight:650;letter-spacing:1.6px;color:#5a7151;background:#eef2e4;border:1px solid #dfe6d2;border-radius:999px;padding:5px 11px;text-transform:uppercase}
.view-title{margin:0;font-family:Georgia,"Times New Roman",serif;font-weight:400;font-size:clamp(30px,4vw,46px);line-height:1.08;letter-spacing:-.5px;color:#253d33;text-wrap:balance}
.main-nav{display:flex;gap:4px}
.main-nav a{padding:9px 16px;border-radius:999px;color:#5f6b57;font-size:14px;font-weight:550}
.main-nav a:hover{background:#eef1e6}
.main-nav a[aria-current=page]{background:#e3eedb;color:var(--green);font-weight:650}
.nav-profile{flex:none;margin-left:12px;width:40px;height:40px;border-radius:13px;background:linear-gradient(135deg,#367457 0%,#245640 100%);color:#fff;display:grid;place-items:center}
.processing-switch[hidden]+.nav-profile{margin-left:auto}
.nav-profile svg{width:22px;height:22px}
.nav-profile[aria-current=page]{box-shadow:0 0 0 3px #e3eedb}
.tab-bar{position:fixed;left:0;right:0;bottom:0;z-index:20;height:var(--tabbar-height);box-sizing:border-box;display:flex;justify-content:space-around;align-items:flex-end;padding:6px 6px calc(8px + var(--safe-bottom,0px));background:#fffef9f2;border-top:1px solid #e1e5d7;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.tab-bar[hidden]{display:none}
.tab-bar a{flex:1;display:flex;flex-direction:column;align-items:center;gap:3px;min-height:44px;font-size:10px;font-weight:600;color:#65715b}
.tab-bar a svg{width:24px;height:24px}
.tab-bar a[aria-current=page]{color:var(--green);font-weight:700}
.tab-scan-button{width:52px;height:52px;margin-top:-26px;border-radius:50%;background:linear-gradient(135deg,#367457 0%,#245640 100%);color:#fff;display:grid;place-items:center;box-shadow:0 8px 18px #295c474d}
.tab-scan[aria-current=page] .tab-scan-button{box-shadow:0 0 0 4px #e3eedb,0 8px 18px #295c474d}
@media(min-width:761px){.tab-bar{display:none}body.with-tabs{--tabbar-height:0px}}
@media(max-width:760px){.main-nav,.nav-profile{display:none}}
/* Сегодня */
.today-cards{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1fr);gap:16px}
.today-hero{grid-row:span 2;display:flex;align-items:center;gap:28px;padding:30px 32px;border-radius:24px;background:linear-gradient(135deg,#367457 0%,#245640 100%);color:#fff;box-shadow:0 22px 50px #295c4740}
.today-hero-text{flex:1;display:flex;flex-direction:column;gap:10px;min-width:0}
.today-hero-eyebrow{font-size:11px;font-weight:650;letter-spacing:1.8px;opacity:.75}
.today-hero strong{font-family:Georgia,serif;font-weight:400;font-size:clamp(24px,3vw,34px);line-height:1.1}
.today-hero small{font-size:14px;opacity:.82}
.today-hero-go{margin-top:8px;align-self:flex-start;background:#fff;color:#245640;font-weight:700;font-size:15px;border-radius:999px;padding:11px 24px}
.today-hero-board{flex:none;width:150px;padding:9px;box-sizing:border-box;border-radius:14px;background:#ffffff1f;display:grid;gap:2px}
.today-hero-board i{aspect-ratio:1;border-radius:1px;background:#ffffff24}
.today-hero-board i.on{background:#ffffffa6}
.today-card{display:flex;align-items:center;gap:14px;padding:18px;border-radius:18px;background:#fffef9f2;border:1px solid #e1e5d7;color:#30453b;text-align:left;font:inherit}
.today-card strong{display:block;font-size:16px;font-weight:650}
.today-card small{display:block;font-size:13px;color:#5f6b57;margin-top:3px;line-height:1.4}
.today-card-icon{flex:none;width:48px;height:48px;border-radius:14px;background:#e3eedb;color:var(--green);display:grid;place-items:center}
.today-card-icon.draw{background:#f3e9d9;color:#8f5a1b}
.today-card-icon svg{width:24px;height:24px}
@media(max-width:760px){
  .view{padding:18px 16px 28px}
  .today-cards{grid-template-columns:1fr;gap:12px}
  .today-hero{grid-row:auto;padding:18px;gap:14px;border-radius:18px}
  .today-hero-board{width:96px;padding:6px;gap:1px}
  .today-hero-go{padding:9px 18px;font-size:14px}
  .today-card{padding:14px}
}
/* Заглушка разделов, которые появятся позже */
body:not([data-view=puzzle]) .puzzle-label{display:none}
/* Путь наборов и набор (docs/roadmap/mockups/e2-sets, e2-pack) */
.pixel-grid{display:block;width:100%;height:auto}
.sets-head{display:flex;align-items:center;justify-content:space-between;gap:12px}
.sets-stars,.pack-stars{display:inline-flex;align-items:center;gap:5px;padding:6px 12px;border-radius:999px;background:#fdf3df;color:#8b6011;font-weight:700;font-size:14px}
.sets-stars svg,.pack-stars svg{width:16px;height:16px;fill:#e0a72e}
.view.pack{padding:0}
.pack-header{padding:16px max(20px,calc((100% - 1040px)/2)) 20px;display:flex;flex-direction:column;gap:8px;border-bottom:1px solid #00000010;color:#3d2f20}
.pack-top{display:flex;align-items:center;justify-content:space-between}
.pack-back{width:44px;height:44px;margin-left:-10px;display:grid;place-items:center;color:inherit}
.pack-back svg{width:22px;height:22px}
.pack-stars{background:#ffffff99}
.pack-eyebrow{font-size:10px;font-weight:650;letter-spacing:1.6px;opacity:.7}
.pack-title{margin:0;font-family:Georgia,"Times New Roman",serif;font-weight:400;font-size:clamp(30px,4vw,42px)}
.pack-lead{margin:0;font-size:14px;line-height:1.5;opacity:.8;max-width:60ch}
.pack-progress{display:flex;align-items:center;gap:10px;margin-top:4px}
.pack-progress span{flex:1;max-width:420px;height:8px;border-radius:4px;background:#ffffff99}
.pack-progress i{display:block;height:8px;border-radius:4px;background:var(--green)}
.pack-progress b{font-size:12px;font-weight:650}
.pack-body{padding:18px 20px 40px}
.pack-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(92px,1fr));gap:10px}
.pack-tile{aspect-ratio:1;border-radius:16px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;font:inherit;color:#30453b}
.pack-tile.solved{background:#fffef9;border:1px solid #e1e5d7}
.pack-tile.solved .pack-picture{width:54%}
.pack-tile-stars{font-size:12px;letter-spacing:1px;color:#e0a72e}
.pack-tile.current{background:#fffef9;border:3px solid var(--green);box-shadow:0 0 0 5px #295c471f}
.pack-tile.locked{background:#eceee6;color:#65715b}
.pack-tile-number{font-family:Georgia,serif;font-size:26px;color:inherit}
.pack-tile.current .pack-tile-number{color:var(--green)}
.pack-tile-go{padding:5px 12px;border-radius:999px;background:var(--green);color:#fff;font-size:12px;font-weight:650}
.pack-surprise{margin-top:14px;display:flex;align-items:center;gap:14px;padding:14px;border-radius:16px;border:2px dashed #d6c6a8;background:#f3e9d980}
.pack-fragments,.pack-cover{flex:none;width:96px;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:3px}
.pack-fragments i{aspect-ratio:1;border-radius:3px;background:#e8dcc7}
.pack-cover{grid-template-columns:none;gap:0}
.pack-surprise strong{display:block;font-size:14px;font-weight:650;color:#5b4630}
.pack-surprise small{display:block;font-size:12px;color:#6e5a43;margin-top:2px}
/* Прохождение и «Готово» (docs/roadmap/mockups/e2-play, d-play, e2-done) */
.play-bar{flex-shrink:0;position:relative;display:flex;align-items:center;gap:10px;padding:8px 12px 12px;border-radius:14px;background:#fffef9eb;border:1px solid #e1e5d7}
.play-bar[hidden]{display:none}
.play-back{flex:none;width:40px;height:40px;display:grid;place-items:center;color:#30453b}
.play-back svg{width:22px;height:22px}
.play-title{flex:1;display:flex;flex-direction:column;min-width:0}
.play-title strong{font-size:15px;font-weight:650;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.play-title span{font-size:12px;color:#65715b}
.play-timer{font-size:17px;font-weight:700;font-variant-numeric:tabular-nums;color:#4f5f47;padding:5px 12px;border-radius:999px;background:#eef1e6}
.play-lives{display:flex;gap:2px}
.play-lives svg{width:20px;height:20px;fill:#c0563f}
.play-lives svg.lost{fill:none;stroke:#c9cfbf;stroke-width:2}
.play-progress{position:absolute;left:14px;right:14px;bottom:5px;height:3px;border-radius:2px;background:#e7ebdd}
.play-progress i{display:block;height:3px;border-radius:2px;background:var(--green);transition:width .3s}
.puzzle.playing .solution-card,.puzzle.playing #solve,.puzzle.playing #dock-photo,.puzzle.playing #errors,.puzzle.playing .add-line{display:none}
.puzzle.playing .play-pause{display:block}
.board td.cell button.mistake{animation:mistake .6s ease-out}
@keyframes mistake{0%{box-shadow:inset 0 0 0 3px #c0563f;background:#f5e1dc}100%{box-shadow:inset 0 0 0 0 #c0563f}}
.play-overlay{position:absolute;inset:0;z-index:6;display:grid;place-items:center;background:#f6f5efe6;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.play-overlay[hidden]{display:none}
.play-overlay-card{display:flex;flex-direction:column;align-items:center;gap:12px;max-width:300px;text-align:center;padding:24px}
.play-overlay-card strong{font-family:Georgia,serif;font-weight:400;font-size:28px;color:#253d33}
.play-overlay-card p{margin:0;font-size:14px;line-height:1.5;color:#5f6b57}
.play-overlay-card .button{min-height:46px;min-width:200px;display:inline-flex;align-items:center;justify-content:center}
.done-inner{max-width:420px;margin:0 auto;display:flex;flex-direction:column;align-items:center;gap:18px;text-align:center}
.done-stars{display:flex;align-items:flex-end;gap:6px}
.done-stars svg{width:40px;height:40px;fill:#e4e0d2}
.done-stars svg:nth-child(2){width:54px;height:54px}
.done-stars svg.on{fill:#e0a72e}
.done-picture{padding:18px;border-radius:18px;background:#fffef9;border:1px solid #e1e5d6;box-shadow:0 22px 50px #3b4f301f}
.done-picture .pixel-grid{width:220px;border-radius:6px;overflow:hidden;background:#f1f4ea}
/* e21 — the original after solving: «Поле · Оригинал» on a phone; on a laptop both side by side, no switch */
.done-art-switch[hidden]{display:none}
.done-picture{display:flex;gap:16px;align-items:center;justify-content:center}
.done-original{width:220px;height:220px;object-fit:contain;border-radius:6px;background:#f1f4ea}
.done-original[hidden],.done-picture.show-original #done-picture,.done-picture:not(.show-original) .done-original{display:none}
@media(min-width:1100px){
  #done-art-switch{display:none}
  .done-inner:has(.done-original:not([hidden])){max-width:560px}
  .done-picture.show-original #done-picture,.done-picture .done-original:not([hidden]){display:block}
}
.done-heading{display:flex;flex-direction:column;gap:4px}
.done-heading h1{margin:0;font-family:Georgia,"Times New Roman",serif;font-weight:400;font-size:34px;color:#253d33}
.done-heading span{font-size:14px;color:#5f6b57}
.done-stats{width:100%;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-radius:16px;background:#fffef9f2;border:1px solid #e1e5d7}
.done-stats div{display:flex;flex-direction:column;gap:2px;padding:12px 0}
.done-stats div+div{border-left:1px solid #ebeee3}
.done-stats b{font-size:20px;font-weight:700;font-variant-numeric:tabular-nums}
.done-stats span{font-size:11px;color:#65715b}
.done-actions{width:100%;display:flex;flex-direction:column;gap:10px}
.done-next{min-height:54px;font-size:16px;display:flex;align-items:center;justify-content:center}
.done-secondary{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.done-secondary .button{min-height:46px;display:flex;align-items:center;justify-content:center}
.puzzle.playing .play-pause{font-size:14px;font-weight:600}
.today-hero{border:0;font:inherit;text-align:left;cursor:pointer;grid-row:span 3}
.today-continue-text{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.today-continue-bar{display:block;height:6px;border-radius:3px;background:#e7ebdd;margin-top:6px}
.today-continue-bar i{display:block;height:6px;border-radius:3px;background:var(--green);width:0}
.today-card-icon.cover{padding:6px;box-sizing:border-box}
.today-card-icon.cover .pixel-grid{width:100%}
@media(max-width:760px){.today-hero{grid-row:auto}}

/* Сканер и библиотека полей (docs/roadmap/mockups/e3-library) */
.welcome{align-items:stretch;justify-content:flex-start;text-align:left;padding:28px 20px 40px}
.scanner-inner{position:relative;z-index:1;width:100%;max-width:720px;margin:0 auto;display:flex;flex-direction:column;align-items:stretch;gap:14px}
.scanner-head{display:flex;align-items:baseline;justify-content:space-between;gap:12px;flex-wrap:wrap}
.scanner-note{font-size:12px;color:#4f6b45;background:#eef2e4;padding:5px 10px;border-radius:999px}
.scanner-actions{display:flex;align-items:center;gap:10px}
.scanner-actions .hero-cta{flex:1;max-width:none;width:auto;margin:0}
.scanner-new{flex:none;width:62px;height:62px;border-radius:50%;border:1px solid #d7ddcf;background:#fffdf7;color:#4f6b45;display:grid;place-items:center}
.scanner-new svg{width:24px;height:24px}
.scanner-inner .file-help{margin:0;text-align:center}
.library{display:flex;flex-direction:column;gap:10px;margin-top:6px}
.library-tabs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));background:#eef1e6;border-radius:12px;padding:3px}
.library-tabs button{height:38px;border-radius:9px;font-size:13px;color:#5f6b57}
.library-tabs button[aria-selected=true]{background:#fff;box-shadow:0 1px 4px #394d3014;color:var(--green);font-weight:650}
.library-list{display:flex;flex-direction:column;gap:8px}
.library-item{display:flex;gap:12px;align-items:center;padding:10px;border-radius:14px;background:#fffef9eb;border:1px solid #e1e5d7;text-align:left;font:inherit;color:#30453b}
.library-thumb{flex:none;width:48px;height:60px;border-radius:6px;transform:rotate(var(--tilt,0deg));background-color:#f4f1e8;background-image:linear-gradient(#d9d3c2 1px,transparent 1px),linear-gradient(90deg,#d9d3c2 1px,transparent 1px);background-size:6px 6px;box-shadow:inset 0 0 0 1px #e1dccd}
.library-text{flex:1;min-width:0;display:flex;flex-direction:column;gap:4px}
.library-text strong{font-size:14px;font-weight:650;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.library-text small{font-size:12px;color:#5f6b57}
.library-progress{display:flex;align-items:center;gap:8px}
.library-progress span{flex:1;height:5px;border-radius:3px;background:#e7ebdd}
.library-progress i{display:block;height:5px;border-radius:3px;background:var(--green)}
.library-progress.complete i{background:#94a682}
.library-progress b{font-size:11px;font-weight:650;color:#5f6b57;font-variant-numeric:tabular-nums}
.library-empty{margin:0;padding:18px;border-radius:14px;border:1px dashed #d7ddcf;font-size:13px;line-height:1.5;color:#5f6b57;text-align:center}
.scanner-inner .get-app{margin-top:12px;align-items:center}
@media(max-width:760px){.welcome{padding:18px 16px 28px}.scanner-new{width:58px;height:58px}}
/* Back from a board to the scanner on phones (docs/roadmap/mockups/e1-scan); a pack puzzle has its own */
.board-back{display:none;flex:none;width:40px;height:40px;margin-left:-10px;place-items:center;color:#30453b}
.board-back svg{width:22px;height:22px}
@media(max-width:760px){body[data-view=puzzle]:not(.playing) .board-back{display:grid}}
.welcome-hero.scanner-inner{animation-duration:.25s;animation-delay:0s}
/* Solved lines: their numbers fade (docs/roadmap/mockups/e2-play) */
.board th.line-done .clue-button{color:#c3cab9}
.board th.line-done.hint-line .clue-button{color:#fff}
/* Play bar parts that only the laptop layout shows (docs/roadmap/mockups/d-play) */
.play-stats{display:contents}
.play-heading,.play-back-label,.play-keys{display:none}
.play-side[hidden]{display:none}
@media(min-width:1100px){
  .puzzle.playing{display:grid;grid-template-columns:280px minmax(0,1fr) 340px;grid-template-rows:minmax(0,1fr) auto;column-gap:28px;row-gap:14px;padding:24px 42px 20px}
  .puzzle.playing .play-bar{grid-column:1;grid-row:1/3;align-self:start;flex-direction:column;align-items:stretch;gap:14px;padding:0;background:none;border:0}
  .puzzle.playing .play-back{width:auto;height:auto;justify-content:start;display:flex;align-items:center;gap:6px;font-size:13px;font-weight:600;color:var(--green)}
  .puzzle.playing .play-back svg{width:16px;height:16px}
  .puzzle.playing .play-back-label{display:inline}
  .puzzle.playing .play-heading{display:block;font-family:Georgia,"Times New Roman",serif;font-size:32px;line-height:1.1;color:#253d33}
  .puzzle.playing .play-title strong{display:none}
  .puzzle.playing .play-title span#play-meta{font-size:13px;color:#5f6b57;margin-top:4px}
  .puzzle.playing .play-stats{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;padding:16px;border-radius:16px;background:#fffef9f2;border:1px solid #e1e5d7}
  .puzzle.playing .play-timer{font-size:30px;padding:0;background:none}
  .puzzle.playing .play-progress{position:static;flex-basis:100%;height:6px}
  .puzzle.playing .play-progress i{height:6px}
  .puzzle.playing .play-keys{display:grid;grid-template-columns:1fr auto;gap:9px 10px;margin:0;padding:14px 16px;border-radius:16px;border:1px dashed #d7ddcf;font-size:13px;color:#5f6b57}
  .play-keys dd{margin:0;text-align:right}
  .play-keys kbd{font-family:inherit;font-size:11px;font-weight:650;padding:2px 7px;border-radius:6px;background:#fff;border:1px solid #dcded3;box-shadow:0 1px 0 #dcded3;color:#4f5f47}
  .puzzle.playing .board-area{grid-column:2;grid-row:1;min-height:0}
  .puzzle.playing .action-dock{grid-column:2;grid-row:2;position:static;transform:none;justify-self:center}
  .puzzle.playing .play-side{grid-column:3;grid-row:1/3;align-self:start;display:flex;flex-direction:column;gap:14px}
  .play-side .hint-card{position:static;left:auto;bottom:auto;transform:none;width:auto;display:flex;flex-direction:column;gap:12px;padding:18px 20px;border-radius:18px;background:#fffef9;border:1px solid #e1e5d7;box-shadow:0 16px 40px #3b4f301c;animation:none}
  .play-side .hint-card[hidden]{display:none}
  .play-pack{padding:16px 18px;border-radius:18px;display:flex;flex-direction:column;gap:10px;background:var(--pack-bg,#eef2e4);color:#3d2f20}
  .play-pack-head{display:flex;align-items:baseline;justify-content:space-between;gap:8px;font-size:14px}
  .play-pack-head span{font-size:12px;font-weight:650}
  .play-pack-dots{display:grid;grid-template-columns:repeat(10,minmax(0,1fr));gap:4px}
  .play-pack-dots i{aspect-ratio:1;border-radius:4px;background:#ffffff99}
  .play-pack-dots i.current{background:var(--green)}
}
@media(max-width:1099px){.play-side{display:none}}
/* Печать (docs/roadmap/mockups/e2-print): лист размечен в миллиметрах */
.print-inner{max-width:520px}
.print-head{display:flex;align-items:center;gap:6px}
.print-preview{display:grid;place-items:center;padding:6px 0}
.print-preview .print-sheet{box-shadow:0 18px 40px #3b4f302e,0 1px 0 #e1e5d7;border-radius:4px;transform-origin:top left}
.print-preview-frame{overflow:hidden;border-radius:4px}
.print-option{display:flex;align-items:center;gap:10px;padding:12px 14px;border-radius:14px;background:#fffef9f2;border:1px solid #e1e5d7;font-size:14px}
.print-option span{flex:1}
.print-option small{display:block;margin-top:3px;font-size:12px;color:#65715b;line-height:1.4}
.print-option input{width:20px;height:20px;accent-color:var(--green)}
.print-note{margin:0;font-size:13px;line-height:1.5;color:#5f6b57}
.print-go{min-height:52px;font-size:15px}
.done-secondary .button{min-height:46px}
.done-pack{align-self:center;padding:8px;font-size:14px;font-weight:600;color:var(--green)}
.print-sheets{display:none}
.print-sheet{position:relative;width:210mm;height:297mm;box-sizing:border-box;padding:14mm 12mm 12mm;background:#fff;color:#1f2a24;font-family:Inter,-apple-system,"Segoe UI",sans-serif;display:flex;flex-direction:column;gap:6mm;overflow:hidden}
.print-mark{position:absolute;width:7mm;height:7mm;background:#111;box-shadow:inset 0 0 0 1.4mm #111,inset 0 0 0 2.4mm #fff}
.print-mark.tl{left:5mm;top:5mm}.print-mark.tr{right:5mm;top:5mm}.print-mark.bl{left:5mm;bottom:5mm}.print-mark.br{right:5mm;bottom:5mm}
.print-top{display:flex;justify-content:space-between;align-items:flex-start;gap:8mm}
.print-brand{font-size:4mm;font-weight:800;letter-spacing:-.2mm}
.print-name{display:block;font-family:Georgia,"Times New Roman",serif;font-size:8mm;margin-top:1mm}
.print-meta{display:block;font-size:3.2mm;color:#5d665a;margin-top:1mm}
.print-qr{width:26mm;height:26mm;flex:none}
.print-board{flex:1;display:grid;place-items:center}
.print-grid{display:grid;width:max-content}
.print-clue{display:flex;align-items:flex-end;justify-content:center;font-weight:600;line-height:1.1;color:#1f2a24}
.print-clue.row{align-items:center;justify-content:flex-end;padding-right:1.2mm;white-space:nowrap}
.print-clue.col{flex-direction:column;justify-content:flex-end;align-items:center;padding-bottom:1mm}
.print-cells{display:grid;border:.6mm solid #111}
.print-cells i{border-right:.15mm solid #9a9a9a;border-bottom:.15mm solid #9a9a9a;box-sizing:border-box}
.print-cells i.r5{border-right:.45mm solid #111}.print-cells i.b5{border-bottom:.45mm solid #111}
.print-cells i.rl{border-right:0}.print-cells i.bl{border-bottom:0}
.print-foot{font-size:3mm;color:#5d665a;text-align:center}
@media print{
  @page{size:A4;margin:0}
  body{height:auto;overflow:visible;background:#fff}
  body>*:not(#print-sheets){display:none!important}
  #print-sheets{display:block}
  .print-sheet{break-after:page;page-break-after:always}
}
.pack-actions{display:flex;align-items:center;gap:8px}
.pack-print{padding:6px 12px;border-radius:999px;background:#ffffff99;color:inherit;font-size:13px;font-weight:600}
/* Вход и профиль (docs/roadmap/mockups/e3-login, e4-profile) */
.login{max-width:400px;align-items:stretch}
.login[hidden],.account[hidden]{display:none}
.login-form{display:flex;flex-direction:column;gap:16px}
.login-board{align-self:center;width:84px;padding:11px;border-radius:18px;background:#fffef9;border:1px solid #e1e5d6;box-shadow:0 18px 40px #3b4f301f;transform:rotate(-4deg);display:grid;gap:2px}
.login-board i{aspect-ratio:1;border-radius:2px;background:#eef1e6}
.login-board i.on{background:var(--green)}
.login-head{display:flex;flex-direction:column;gap:8px;text-align:center}
.login-head p{margin:0;font-size:14px;line-height:1.5;color:#5f6b57}
.login-tabs{display:grid;grid-template-columns:1fr 1fr;padding:4px;border-radius:999px;background:#eceee6}
.login-tabs button{padding:9px 0;border:0;border-radius:999px;background:none;font:inherit;font-size:14px;font-weight:600;color:#5f6b57;cursor:pointer}
.login-tabs button[aria-selected=true]{background:#fff;color:#30453b;box-shadow:0 1px 3px #0000001a}
.login-field{display:flex;flex-direction:column;gap:6px}
.login-field label{font-size:12px;font-weight:650;letter-spacing:.4px;color:#5f6b57}
.login-field input{width:100%;box-sizing:border-box;height:50px;padding:0 14px;border-radius:14px;border:1px solid #d7ddcf;background:#fff;font:inherit;font-size:16px;color:#30453b}
.login-field input[aria-invalid=true]{border-color:#c98b80;background:#fdf6f4}
.login-password{position:relative}
.login-password input{padding-right:48px}
.login-eye{position:absolute;right:4px;top:4px;width:42px;height:42px;border:0;border-radius:10px;background:none;color:#65715b;display:grid;place-items:center;cursor:pointer}
.login-eye svg{width:20px;height:20px}
.login-eye[aria-pressed=false] .login-eye-off{display:none}
.login-hint{margin:-10px 0 0;font-size:12px;color:#65715b}
.login-benefits{margin:0;padding:12px 14px;border-radius:14px;background:#fffef9f2;border:1px solid #e1e5d7;font-size:13px;line-height:1.5;color:#5f6b57}
.login-benefits b{color:#30453b}
.login-code{display:grid;gap:10px}
.login-code input{font-size:20px;letter-spacing:.2em;font-variant-numeric:tabular-nums}
.login-error{margin:0;padding:10px 12px;border-radius:12px;background:#f5e1dc;font-size:13px;line-height:1.4;color:#6e2c22}
.login-note{margin:0;padding:12px 14px;border-radius:12px;background:#fbefdc;font-size:13px;line-height:1.45;color:#6e4c1c}
.login-actions{display:flex;flex-direction:column;gap:6px;margin-top:4px}
.login-actions .button{min-height:52px;font-size:15px}
.login-link{padding:10px;font-size:14px;font-weight:600;color:var(--green)}
.login-legal{margin:0;text-align:center;font-size:12px;line-height:1.45;color:#65715b}
.login-legal a{color:inherit;text-decoration:underline;text-underline-offset:2px}
.refund-sheet h2{margin:0;font-family:Georgia,"Times New Roman",serif;font-weight:400;font-size:24px;color:#253d33}
.refund-text{margin:0;font-size:14px;line-height:1.5;color:#5f6b57}
.shop-closed{margin:0;padding:12px 14px;border-radius:14px;background:#fbefdc;font-size:13px;line-height:1.45;color:#6e4c1c}
.shop-closed b{display:block;margin-bottom:2px;font-size:14px;color:#5b3c12}
.login-skip{padding:10px;text-align:center;font-size:14px;font-weight:600;color:#5f6b57}
.login-back{align-self:flex-start;display:flex;align-items:center;gap:6px;padding:6px 0;font-size:14px;font-weight:600;color:#5f6b57}
.login-back svg{width:18px;height:18px}
.login-mail{align-self:center;width:84px;height:84px;border-radius:26px;background:#e3eedb;color:var(--green);display:grid;place-items:center}
.login-mail svg{width:40px;height:40px}
.account{max-width:560px}
.account-head{display:flex;align-items:center;gap:14px}
.account-avatar{flex:none;width:58px;height:58px;border-radius:18px;background:linear-gradient(135deg,#367457 0%,#245640 100%);color:#fff;display:grid;place-items:center;font-family:Georgia,serif;font-size:26px}
.account-head strong{display:block;font-size:18px;font-weight:700;overflow-wrap:anywhere}
.account-who{flex:1;min-width:0}
.account-who span{display:block;font-size:13px;color:#5f6b57;margin-top:2px}
.account-who small{display:block;font-size:11px;color:#65715b;margin-top:2px}
.account-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-radius:16px;background:#fffef9f2;border:1px solid #e1e5d7}
.account-stats div{display:flex;flex-direction:column;align-items:center;gap:2px;padding:12px 4px;text-align:center}
.account-stats div+div{border-left:1px solid #ebeee3}
.account-stats b{font-size:20px;font-weight:750;font-variant-numeric:tabular-nums}
.account-stats span{font-size:11px;color:#65715b}
.account-levels{display:flex;flex-direction:column;gap:8px;padding:12px 14px;border-radius:16px;background:#fffef9f2;border:1px solid #e1e5d7}
.account-levels b{font-size:14px;font-weight:650}
.account-level{display:grid;grid-template-columns:72px minmax(0,1fr) 30px;align-items:center;gap:8px;font-size:12px;color:#5f6b57}
.account-level span:nth-child(2){height:8px;border-radius:4px;background:#eef1e6;overflow:hidden}
.account-level i{display:block;height:8px;border-radius:4px;background:var(--green)}
.account-level b{font-size:12px;text-align:right;font-variant-numeric:tabular-nums;color:#30453b}
.account-note{margin:0;font-size:13px;color:#65715b}
.account-actions{display:flex;align-items:center;justify-content:space-between;gap:10px}
.account-actions .button{min-height:44px;padding:0 20px}
.account-delete{font-size:13px;font-weight:600;color:#a8463b;padding:8px}
.account-confirm{padding:14px;border-radius:14px;background:#f5e1dc;color:#6e2c22;display:flex;flex-direction:column;gap:10px;font-size:14px}
.account-confirm[hidden]{display:none}
.account-confirm p{margin:0;line-height:1.45}
.account-confirm-actions{display:flex;flex-direction:column;gap:8px}  /* e32: one under another, the whole width */
.account-confirm-actions .button,.account-confirm-manage{width:100%}
.account-confirm .button{min-height:42px;padding:0 16px}
.button.danger{background:#a8463b;border-color:#a8463b}
/* Шторка для гостя (docs/roadmap/mockups/e3-guest) */
.guest-sheet{width:min(480px,100vw);max-width:100vw;margin:auto auto 0;border-radius:26px 26px 0 0;padding:12px 22px calc(24px + var(--safe-bottom,0px));display:flex;flex-direction:column;gap:14px}
.guest-sheet:not([open]){display:none}
@media(min-width:761px){.guest-sheet{margin:auto;border-radius:22px}}
.guest-handle{align-self:center;width:40px;height:5px;border-radius:3px;background:#dcded3}
.guest-head{display:flex;gap:14px;align-items:center}
.guest-lock{flex:none;width:52px;height:52px;border-radius:16px;background:#eef2e4;color:var(--green);display:grid;place-items:center}
.guest-lock svg{width:26px;height:26px}
.guest-head h2{margin:0;font-family:Georgia,"Times New Roman",serif;font-weight:400;font-size:24px;color:#253d33}
.guest-head span{font-size:13px;color:#5f6b57}
.guest-label{font-size:11px;font-weight:650;letter-spacing:1.2px;color:#65715b}
.guest-list{border:1px solid #e1e5d7;border-radius:14px;padding:2px 14px}
.guest-row{display:flex;align-items:center;gap:10px;padding:9px 0;font-size:14px}
.guest-row+.guest-row{border-top:1px solid #ebeee3}
.guest-row .difficulty-tier{width:54px}
.guest-row span:nth-child(2){flex:1}
.guest-row em{font-style:normal;font-size:12px;font-weight:600;color:#a8641a}
.guest-row em.done{color:var(--green)}
.guest-signup{min-height:52px;display:flex;align-items:center;justify-content:center;font-size:16px}
.guest-later{align-self:center;font-size:14px;font-weight:600;color:#5f6b57;padding:8px}
.pack-tile.account{background:#eceee6;color:#65715b;position:relative}
.pack-tile.account:after{content:'';position:absolute;right:8px;top:8px;width:10px;height:9px;border:2px solid #9aa391;border-top-width:5px;border-radius:2px 2px 1px 1px}

/* Hints and checks that never cover what they talk about (docs/roadmap/mockups/e2-fixes, items 1-2) */
.board td.cell{position:relative}
.board td.cell.focus-line,.board:has(.correction-target) td.cell.focus-line{background:transparent}
.board td.cell[class*=band-]:after{content:'';position:absolute;inset:-1px;z-index:2;pointer-events:none;border:0 solid var(--green)}
.board td.cell.band-row:after{border-top-width:max(2px,calc(var(--cell)*.09));border-bottom-width:max(2px,calc(var(--cell)*.09))}
.board td.cell.band-row.band-start:after{border-left-width:max(2px,calc(var(--cell)*.09));border-radius:4px 0 0 4px}
.board td.cell.band-row.band-end:after{border-right-width:max(2px,calc(var(--cell)*.09));border-radius:0 4px 4px 0}
.board td.cell.band-col:after{border-left-width:max(2px,calc(var(--cell)*.09));border-right-width:max(2px,calc(var(--cell)*.09))}
.board td.cell.band-col.band-start:after{border-top-width:max(2px,calc(var(--cell)*.09));border-radius:4px 4px 0 0}
.board td.cell.band-col.band-end:after{border-bottom-width:max(2px,calc(var(--cell)*.09));border-radius:0 0 4px 4px}
.board td.cell button.suggest-fill:not(.filled){background:repeating-linear-gradient(135deg,#9fcb8e 0 3px,#dcebd3 3px 6px)}
.board td.cell button.suggest-cross:not(.filled){background:#eef3e8}
.cell button.suggest-cross:before,.cell button.suggest-cross:after{background:#6f9a72}
/* An error is red everywhere: the cell, its line numbers. */
.cell button.correction-target{box-shadow:inset 0 0 0 max(1px,calc(var(--cell)*.08)) #b4493c;background:#fbe9e5}
.cell button.correction-target.filled{background:#8e3b31}
.cell button.correction-target:focus-visible{outline:2px solid #b4493c}
.board:has(.correction-target) th.focus-axis .clue-button{background:#fbe9e5;color:#a8463b;box-shadow:inset 0 0 0 1px #e6b9b0}
.board th.col-clue.correction-axis .clue-button:before,.board:has(.correction-target) th.col-clue.focus-axis .clue-button:before,.board th.row-clue.correction-axis .clue-button:before,.board:has(.correction-target) th.row-clue.focus-axis .clue-button:before{background:#fbe9e5;box-shadow:inset 0 0 0 1px #e6b9b0}
.board-area .board-viewport{margin-bottom:var(--hint-space,0px)}
.hint-handle{display:none;align-self:center;width:36px;height:4px;border-radius:2px;background:#dcded3;margin:-4px 0 -2px}
.hint-head{position:relative}
.hint-collapse{margin-left:auto;flex:none;padding:6px 8px;font-size:12px;font-weight:600;color:#5f6b57;border-radius:8px}
.hint-card.folded{gap:8px}
.hint-card.folded #hint-text,.hint-card.folded .hint-diagram,.hint-card.folded .hint-actions{display:none}
@media(max-width:1099px){.hint-handle{display:block}}
.board-side{display:none}
@media(min-width:1100px){
  .board-side{display:flex;position:absolute;top:10px;right:0;width:340px;flex-direction:column;gap:12px;z-index:4}
  .board-area:has(.board-side>:not([hidden])) .board-viewport{margin-right:360px}
  .board-side .hint-card{position:static;left:auto;bottom:auto;transform:none;width:auto;animation:none;padding:18px 20px;border-radius:18px;box-shadow:0 16px 40px #3b4f301c}
  .board-side .solve-status{position:static;left:auto;top:auto;bottom:auto;transform:none;width:auto;max-width:none;margin:0;padding:14px 16px;border-radius:16px;display:flex;flex-wrap:wrap;align-items:center;gap:10px;text-align:left;white-space:normal;font-size:13px}
  .board-side .solve-status #solve-message{white-space:normal;flex-basis:100%}
  .board-side .solve-status .button{border-radius:12px;padding:9px 14px;font-size:12px}
  .board-side .hint-collapse,.play-side .hint-collapse{display:none}
}
/* A mistake is visible: the corrected cell, the broken heart, a line of text (e2-fixes, item 3) */
.cell button.fixed{box-shadow:inset 0 0 0 max(1px,calc(var(--cell)*.06)) #d9a093}
.cell button.fixed.empty{background:#fbe9e5;color:#b4493c}
.cell button.fixed.filled{background:#7c3a31}
.board td.cell.fixed-cell:before{content:'';position:absolute;right:1px;top:1px;width:max(5px,calc(var(--cell)*.22));height:max(5px,calc(var(--cell)*.22));box-sizing:border-box;border-radius:50%;background:#b4493c;border:1.5px solid #fff;z-index:3;pointer-events:none}
.mistake-toast{position:absolute;left:50%;top:10px;transform:translateX(-50%);z-index:6;width:min(380px,calc(100% - 24px));box-sizing:border-box;display:flex;gap:10px;align-items:center;padding:10px 12px;border-radius:14px;background:#fff;border:1px solid #efcfc8;box-shadow:0 10px 30px #6e2c2222;font-size:13px;line-height:1.35;color:#30453b}
.mistake-toast.at-bottom{top:auto;bottom:calc(var(--hint-space,0px) + 10px)}
.mistake-toast b{color:#b4493c}
.mistake-toast-icon{flex:none;width:34px;height:34px;border-radius:10px;background:#fbe9e5;display:grid;place-items:center}
.mistake-toast-icon svg{width:20px;height:20px}
.mistake-toast.shown{animation:toast-pop .25s ease-out}
@keyframes toast-pop{from{opacity:0;transform:translate(-50%,-6px)}to{opacity:1;transform:translate(-50%,0)}}
.play-lives{position:relative}
.heart-break{position:absolute;top:0;width:20px;height:20px;pointer-events:none}
.heart-break svg{position:absolute;inset:0;width:20px;height:20px;fill:#c0563f;stroke:none}
.heart-break .left{clip-path:polygon(0 0,52% 0,44% 40%,57% 56%,46% 100%,0 100%);animation:shard-left .85s ease-in forwards}
.heart-break .right{clip-path:polygon(52% 0,100% 0,100% 100%,46% 100%,57% 56%,44% 40%);animation:shard-right .85s ease-in forwards}
@keyframes shard-left{0%,18%{transform:scale(1.25)}30%{transform:translate(-2px,0) rotate(-8deg) scale(1.1)}100%{transform:translate(-7px,18px) rotate(-34deg);opacity:0}}
@keyframes shard-right{0%,18%{transform:scale(1.25)}30%{transform:translate(2px,0) rotate(8deg) scale(1.1)}100%{transform:translate(7px,20px) rotate(30deg);opacity:0}}
@media(prefers-reduced-motion:reduce){.heart-break{display:none}}
.rules-dialog{width:min(440px,calc(100vw - 24px))}
.rules-list{margin:12px 0;padding-left:20px;display:flex;flex-direction:column;gap:10px;font-size:14px;line-height:1.5;color:#46594d}
.rules-list b{color:#30453b}
/* Printing several puzzles per sheet and picking them (e2-fixes, item 5) */
.print-top{align-items:baseline}
.print-page{font-size:3.2mm;color:#5d665a}
.print-slots{flex:1;display:grid;align-content:center;justify-content:center;margin-top:3mm}
.print-slot{display:flex;flex-direction:column;gap:2mm;min-width:0;min-height:0}
.print-slot-head{display:flex;justify-content:space-between;align-items:flex-start;gap:3mm}
.print-slot-head .print-name{margin-top:0}
.print-slot .print-board{flex:1;display:grid;place-items:start center;min-height:0}
.print-preview{gap:14px;max-height:62vh;overflow:auto}
.print-preview.empty{display:none}
.print-modes{grid-template-columns:repeat(auto-fit,minmax(0,1fr))}
.print-pick-list{display:flex;flex-direction:column;gap:6px;max-height:300px;overflow:auto}
.print-pick-item{display:flex;align-items:center;gap:10px;padding:9px 12px;border-radius:12px;background:#fffef9f2;border:1px solid #e1e5d7;font-size:14px}
.print-pick-item input{width:18px;height:18px;accent-color:var(--green);flex:none}
.print-pick-item small{margin-left:auto;font-size:12px;color:#65715b;white-space:nowrap}
.library-entry{position:relative}
.library-entry .library-item{width:100%;padding-right:52px}
.library-print{position:absolute;right:8px;top:50%;transform:translateY(-50%);width:40px;height:40px;border-radius:12px;display:grid;place-items:center;color:#5f6b57}
.library-print:hover{background:#eef1e6}
.library-print svg{width:20px;height:20px}
/* «Сегодня» on a laptop: the scanner and the packs on the page (e2-fixes, item 6) */
.today-wide{display:none}
@media(min-width:761px){
  .today-wide{display:flex;flex-direction:column;gap:16px;margin-top:20px}
  .today-cards a.today-card[href="#scanner"]{display:none}
  .today-drop{display:flex;align-items:center;gap:14px;padding:16px 18px;border:2px dashed #b7c8a8;border-radius:20px;background:#f3f6eaee}
  .today-drop-main{flex:1;display:flex;align-items:center;gap:16px;text-align:left;padding:0;color:#30453b}
  .today-drop-main strong{display:block;font-size:16px;font-weight:700}
  .today-drop-main small{display:block;font-size:13px;color:#5f6b57;margin-top:3px}
  .today-drop-icon{flex:none;width:54px;height:54px;border-radius:16px;background:var(--green);color:#fff;display:grid;place-items:center}
  .today-drop-icon svg{width:26px;height:26px}
  .today-recent{display:flex;gap:8px}
  .today-recent-item{display:flex;flex-direction:column;align-items:flex-start;gap:2px;padding:9px 12px;border-radius:14px;background:#fffef9;border:1px solid #e1e5d7;text-align:left;max-width:170px}
  .today-recent-item strong{font-size:13px;font-weight:650;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:146px}
  .today-recent-item small{font-size:12px;color:#65715b}
  .today-packs-head{display:flex;align-items:baseline;justify-content:space-between}
  .today-packs-head h2{margin:0;font-size:17px;font-weight:700}
  .today-packs-head a{font-size:13px;font-weight:600;color:var(--green)}
  .today-packs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
  .today-pack{display:flex;align-items:center;gap:12px;padding:14px 14px 14px 16px;border-radius:16px;color:#3d2f20;min-height:84px;transition:transform .15s}
  .today-pack:hover{transform:translateY(-2px)}
  .today-pack-text{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
  .today-pack strong{font-size:15px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .today-pack small{font-size:12px;opacity:.75}
  .today-pack-bar{margin-top:6px;height:5px;border-radius:3px;background:#ffffff99;overflow:hidden}
  .today-pack-bar i{display:block;height:100%;border-radius:3px}
  .today-pack-cover{flex:none;width:58px;height:58px;padding:6px;border-radius:12px;background:#fffef9b3;display:grid;place-items:center}
  .today-pack-cover .pixel-grid{width:100%}
}
/* A new board: the card that says how to fill it, the first «?» pulsing (e2-fixes, item 7) */
.manual-coach p{margin:0;font-size:13px;line-height:1.5;color:#46594d}
.board th.coach-clue .clue-button{background:#fff3d6;color:#8a5a12;border-radius:6px;box-shadow:0 0 0 2px #e8b75a;animation:coach-pulse 1.4s ease-in-out infinite}
@keyframes coach-pulse{50%{box-shadow:0 0 0 2px #e8b75a33}}
/* Profile: level, experience, achievements (docs/roadmap/mockups/e4-profile) */
.account-menu{flex:none;width:44px;height:44px;border-radius:12px;display:grid;place-items:center;color:#778a6d}
.account-menu:hover,.account-menu[aria-expanded=true]{background:#eef1e6}
.account-menu svg{width:22px;height:22px}
.account-xp{display:flex;flex-direction:column;gap:5px}
.account-xp>div{display:flex;justify-content:space-between;font-size:12px;color:#5f6b57;font-variant-numeric:tabular-nums}
.account-xp-bar{height:8px;border-radius:4px;background:#e7ebdd;overflow:hidden}
.account-xp-bar i{display:block;height:8px;border-radius:4px;background:var(--green);transition:width .5s ease-out}
.account-stats{grid-template-columns:repeat(4,minmax(0,1fr))}
.account-stats b.hot{color:#a8641a}
.account-stats span{font-size:10px}
.account-badges{display:flex;flex-direction:column;gap:8px}
.account-badges-head{display:flex;justify-content:space-between;align-items:baseline}
.account-badges-head b{font-size:14px;font-weight:650}
.account-badges-head span{font-size:12px;color:#65715b}
.account-badges-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px 8px}
.account-badge{display:flex;flex-direction:column;align-items:center;gap:4px;text-align:center}
.account-badge span{width:52px;height:52px;border-radius:16px;display:grid;place-items:center;background:#eceee6;color:#b5bcab;font-size:15px;font-weight:800}
.account-badge.got span{background:#e3eedb;color:var(--green)}
.account-badge small{font-size:11px;line-height:1.2;color:#65715b}
.account-badge.got small{color:#4f5f47;font-weight:600}
.account-badge em{font-style:normal;font-size:10px;line-height:1.25;color:#65715b}
@media(min-width:761px){.account-badges-grid{grid-template-columns:repeat(5,minmax(0,1fr))}}
#account-levels{display:flex;flex-direction:column;gap:7px}
@media(min-width:1100px){
  .account{max-width:1040px;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-areas:"head head" "xp xp" "stats badges" "levels badges";grid-template-rows:auto auto auto 1fr;column-gap:28px;row-gap:16px;align-items:start}
  .account>.account-head{grid-area:head}.account>.account-xp{grid-area:xp}
  .account>.account-stats{grid-area:stats}.account>.account-levels{grid-area:levels}.account>.account-badges{grid-area:badges}
  .account-badges-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
}
/* The streak and the daily goal (docs/roadmap/mockups/e4-streak, Main, d-today) */
.nav-chip{display:flex;align-items:center;gap:4px;padding:6px 10px;border-radius:999px;font-size:13px;font-weight:700;white-space:nowrap;flex:none}
.nav-chip[hidden]{display:none}
.nav-streak{background:#fbefdc;color:#8e5714}
.nav-streak svg{width:16px;height:16px;fill:#d08a2e}
.nav-streak.cold svg{fill:#e2c49b}
.nav-xp{background:#eef2e4;color:var(--green)}
#nav-streak{margin-left:auto}
#nav-streak~.nav-profile{margin-left:0}
@media(max-width:760px){.nav-chip{padding:5px 8px;font-size:12px}.nav-xp{display:none}}
.today-goal{display:flex;align-items:center;gap:14px;padding:14px;border-radius:16px;background:#fffef9eb;border:1px solid #e1e5d7;color:#30453b}
.goal-ring{--goal:0%;flex:none;width:54px;height:54px;border-radius:50%;background:conic-gradient(var(--green) 0 var(--goal),#e4e9da var(--goal) 100%);display:grid;place-items:center}
.goal-ring b{width:42px;height:42px;border-radius:50%;background:#fffef9;display:grid;place-items:center;font-size:14px;font-weight:700;font-variant-numeric:tabular-nums}
.today-goal-text{flex:1;min-width:0;display:flex;flex-direction:column;gap:6px}
.today-goal-text strong{font-size:14px;font-weight:650}
.today-goal-text small{font-size:12px;color:#5f6b57;margin-top:-4px}
.goal-week{display:flex;justify-content:space-between;max-width:340px}
.goal-day{display:flex;flex-direction:column;align-items:center;gap:3px;font-size:10px;color:#65715b}
.goal-day i{width:24px;height:24px;border-radius:50%;display:grid;place-items:center;background:#f1f3ea;border:2px solid transparent;box-sizing:border-box}
.goal-day svg{width:13px;height:13px;fill:#d9dccf}
.goal-day.met i{background:#fbefdc}.goal-day.met svg{fill:#d08a2e}
.goal-day.frozen i{background:#e6f0f7}.goal-day.frozen svg{fill:none;stroke:#4d7ea8}
.goal-day.today i{background:#fffef9;border-color:#d08a2e}.goal-day.today svg{fill:#e9d3b3}
.streak{background:#fbf4e8}
.streak-inner{max-width:420px;align-items:center;text-align:center;color:#3d2f20}
.streak-flame{position:relative;margin-top:16px}
.streak-art{width:140px;display:grid;grid-template-columns:repeat(10,minmax(0,1fr));gap:2px;animation:flame-bob 2.4s ease-in-out infinite}
.streak-art i{aspect-ratio:1;border-radius:2px}
.streak-art i.fire{background:#d9822b}.streak-art i.core{background:#f4c25b}
@keyframes flame-bob{50%{transform:translateY(-4px) scale(1.02)}}
.streak-flame b{position:absolute;left:50%;bottom:-14px;transform:translateX(-50%);padding:4px 16px;border-radius:999px;background:#fff;box-shadow:0 6px 18px #a0641e40;font-size:26px;font-weight:800;color:#a8641a;font-variant-numeric:tabular-nums}
.streak-head{display:flex;flex-direction:column;gap:6px;padding-top:10px}
.streak-head h1{color:#3d2f20}
.streak-head p{margin:0;font-size:14px;line-height:1.5;color:#7a6650}
.streak-week{width:100%;display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:4px;padding:12px;box-sizing:border-box;border-radius:16px;background:#fff;border:1px solid #f0e2c9}
.streak-week .goal-day{font-size:11px}
.streak-week .goal-day i{width:30px;height:30px}
.streak-week .goal-day svg{width:16px;height:16px}
.streak-cards{width:100%;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;text-align:left}
.streak-card{padding:14px;border-radius:16px;background:#fff;border:1px solid #f0e2c9;display:flex;flex-direction:column;gap:6px}
.streak-card b{font-size:14px;font-weight:650}
.streak-card small{font-size:12px;line-height:1.4;color:#7a6650}
.streak-card-icon{width:36px;height:36px;border-radius:10px;display:grid;place-items:center}
.streak-card-icon svg{width:20px;height:20px}
.streak-card-icon.freeze{background:#e6f0f7;color:#4d7ea8}.streak-card-icon.award{background:#e3eedb;color:var(--green)}
.streak-remind{width:100%;display:flex;align-items:center;gap:10px;padding:12px 14px;box-sizing:border-box;border-radius:14px;background:#ffffff99;font-size:14px;text-align:left}
.streak-remind svg{width:18px;height:18px;color:#a8641a;flex:none}
.streak-remind span{flex:1}
.streak-remind input{width:20px;height:20px;accent-color:#a8641a}
.streak-continue{width:100%;min-height:54px;border-radius:999px;font-size:16px}
.done-goal{display:flex;align-items:center;justify-content:center;gap:6px;padding:8px 14px;border-radius:999px;background:#f1f3ea;color:#5f6b57;font-size:13px;font-weight:600}
.done-goal svg{width:16px;height:16px;fill:#e2c49b}
.done-goal.met{background:#fbefdc;color:#a8641a}.done-goal.met svg{fill:#d08a2e}
/* The puzzle of the day (docs/roadmap/mockups/e4-daily) */
.daily-inner{max-width:520px}
.daily-week{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:4px}
.daily-day{display:flex;flex-direction:column;align-items:center;gap:4px;padding:6px 0;border-radius:12px;color:#65715b}
.daily-day small{font-size:10px}
.daily-day span{width:32px;height:32px;border-radius:50%;display:grid;place-items:center;font-size:13px;font-weight:650;background:#eceee6;color:#a3ad98}
.daily-day.solved span{background:var(--green);color:#fff}
.daily-day.today{background:#e3eedb}
.daily-day.today:not(.solved) span{background:#fff;color:var(--green);box-shadow:inset 0 0 0 2px var(--green)}
.daily-card{display:flex;gap:14px;align-items:center;padding:14px;border-radius:16px;background:#fffef9f2;border:1px solid #e1e5d7}
.daily-picture{flex:none;width:76px;padding:6px;border-radius:10px;background:#f1f4ea}
.daily-picture .pixel-grid{width:100%}
.daily-card-text{display:flex;flex-direction:column;gap:3px;min-width:0}
.daily-eyebrow{font-size:11px;font-weight:650;letter-spacing:1.2px;color:#65715b}
.daily-card-text b{font-size:26px;font-weight:750;font-variant-numeric:tabular-nums}
.daily-card-text span:last-child{font-size:13px;color:#4f6b45}
.daily-play{min-height:50px;font-size:15px}
.daily-share{min-height:46px;border-radius:999px;font-size:14px;gap:8px;color:#4f6b45;white-space:normal}
.daily-share svg{width:18px;height:18px;flex:none}
.daily-board-head{display:flex;justify-content:space-between;align-items:baseline}
.daily-board-head b{font-size:15px;font-weight:650}
.daily-board-head span{font-size:12px;color:#65715b}
.daily-board{list-style:none;margin:0;padding:2px 12px;border-radius:16px;background:#fffef9f2;border:1px solid #e1e5d7;display:flex;flex-direction:column}
.daily-row{display:flex;align-items:center;gap:10px;padding:8px 6px;margin:0 -6px;border-radius:10px}
.daily-row+.daily-row{border-top:1px solid #ebeee3}
.daily-row b{width:26px;height:26px;border-radius:50%;display:grid;place-items:center;font-size:12px;font-weight:700;color:#65715b;font-variant-numeric:tabular-nums}
.daily-row.medal-1 b{background:#f2d27a;color:#6b4e00}.daily-row.medal-2 b{background:#d9dde2;color:#4b5560}.daily-row.medal-3 b{background:#e8c1a0;color:#6b3f1d}
.daily-row i{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;font-style:normal;font-size:13px;font-weight:700;color:#fff;background:#7d9a8a}
.daily-row span{flex:1;font-size:14px;font-weight:500}
.daily-row strong{font-size:14px;font-weight:650;font-variant-numeric:tabular-nums}
.daily-row.you{background:#e3eedb;border-top-color:transparent}
.daily-row.you i{background:var(--green)}.daily-row.you span{font-weight:700}
.daily-gap{text-align:center;color:#a3ad98;padding:2px 0}
.daily-empty{padding:14px 4px;font-size:13px;color:#65715b;text-align:center}
.daily-note{margin:0;font-size:12px;color:#65715b;text-align:center}
.daily-note a{color:var(--green);font-weight:600}
.daily-week-note{margin-top:-6px}
/* The board does not move for panels and messages (docs/roadmap/mockups/e2-fixes-2, items 1-2) */
#draw-level-row.pending{color:#a3ad98}
@media(min-width:1100px){
  .puzzle:not(.playing) .board-area .board-viewport{margin-right:360px}
  .puzzle:not(.playing) .board-side:empty:before,.puzzle:not(.playing) .board-side:not(:has(>:not([hidden]))):before{content:var(--board-side-label,'Здесь появятся подсказка и проверка — поле не сдвинется');display:block;padding:16px;border:1.5px dashed #d7ddcf;border-radius:16px;font-size:12px;line-height:1.45;color:#a3ad98;text-align:center}
}
.notification{display:flex;align-items:flex-start;gap:12px;text-align:left;position:fixed;overflow:hidden;padding:12px 12px 14px 16px;border-radius:14px;box-shadow:0 10px 30px #3b4f3026;max-width:min(380px,calc(100vw - 24px));z-index:40}
.notification[hidden]{display:none}
.notification #notification-text{flex:1;line-height:1.45}
.notification-close{flex:none;width:26px;height:26px;margin:-3px -2px 0 0;border-radius:8px;background:#f1f3ea;color:#5f6b57;font-size:16px;line-height:1;display:grid;place-items:center}
.notification.busy .notification-close{display:none}
.notification-timer{position:absolute;left:12px;right:12px;bottom:5px;height:2px;border-radius:2px;background:#a5bd92;transform-origin:left;animation:notice-time 4.5s linear forwards}
.notification-timer[hidden]{display:none}
@keyframes notice-time{to{transform:scaleX(0)}}
@media(max-width:760px){.notification{top:calc(env(safe-area-inset-top,0px) + 8px);left:12px;right:12px;transform:none;max-width:none}}
@media(min-width:761px){.notification{top:96px;left:auto;right:24px;transform:none;width:340px}}
/* A locked pack (e2-fixes-2, item 5) */
.lock-card{max-width:420px;margin:0 auto;box-sizing:border-box;align-items:center;text-align:center;padding:48px 20px 24px}
.lock-card-icon{width:64px;height:64px;border-radius:20px;background:#eceee6;color:#65715b;display:grid;place-items:center}
.lock-card-icon svg{width:30px;height:30px}
.lock-card h1{font-size:28px}
.lock-card p{margin:0;font-size:14px;line-height:1.5;color:#5f6b57}
.lock-card-meter{display:block;width:100%;height:8px;border-radius:4px;background:#e4e7dc;overflow:hidden}
.lock-card-meter i{display:block;height:8px;border-radius:4px;background:#e0a72e}
.lock-card-go{width:100%;min-height:50px;font-size:15px}
.lock-card-close{font-size:14px;font-weight:600;color:#5f6b57;padding:8px}
.lock-card-skip,.band-lock-skip{width:100%;min-height:44px;font-size:14px}
.today-pack.locked{position:relative;opacity:.85}
.today-pack .lock-card-meter{margin-top:6px;height:5px}
/* Several puzzles on one photo (e2-fixes-2, item 3) */
.photo-switcher{display:flex;align-items:center;gap:10px;margin:0 0 8px;padding:7px 8px 7px 10px;border-radius:14px;background:#fffef9;border:1px solid #e1e5d7;font-size:13px;flex-shrink:0}
.photo-switcher[hidden]{display:none}
.photo-switcher img{width:38px;height:28px;object-fit:cover;border-radius:6px;background:#e7ebdd;flex:none}
.photo-switcher span{flex:1;min-width:0;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.photo-switcher-go{flex:none;padding:8px 12px;border-radius:10px;font-size:13px;font-weight:650;color:var(--green);background:#eef1e6}
.photo-puzzles h2{margin:0;font-family:Georgia,"Times New Roman",serif;font-weight:400;font-size:24px;color:#253d33}
.photo-puzzles-list{display:flex;flex-direction:column;gap:8px}
.photo-puzzle{display:flex;align-items:center;gap:12px;padding:10px;border-radius:14px;border:1px solid #e1e5d7;background:#fff;text-align:left}
.photo-puzzle.current{border:2px solid var(--green);padding:9px}
.photo-puzzle img{width:60px;height:46px;object-fit:cover;border-radius:8px;background:#e7ebdd;flex:none}
.photo-puzzle strong{display:block;font-size:15px}
.photo-puzzle small{display:block;font-size:12px;color:#5f6b57;margin-top:2px}
.photo-puzzles .button{min-height:46px}
/* Account menu and settings (docs/roadmap/mockups/e2-fixes-2, item 4) */
.user-menu{position:fixed;z-index:45;width:min(292px,calc(100vw - 24px));background:#fffef9;border:1px solid #e1e5d7;border-radius:16px;box-shadow:0 18px 40px #3b4f3029;padding:6px;display:flex;flex-direction:column}
.user-menu[hidden]{display:none}
.user-menu-who{padding:10px 12px;border-bottom:1px solid #ebeee3;margin-bottom:4px}
.user-menu-who b{display:block;font-size:14px;overflow-wrap:anywhere}
.user-menu-who small{display:block;font-size:12px;color:#5f6b57;margin-top:2px}
.user-menu a,.user-menu button{display:block;padding:11px 12px;border-radius:10px;font-size:14px;color:#30453b;text-align:left;width:100%}
.user-menu a:hover,.user-menu button:hover,.user-menu a:focus-visible,.user-menu button:focus-visible{background:#eef1e6;outline:none}
.user-menu-muted{padding:6px 12px;font-size:12px;color:#65715b}
.user-menu hr{border:0;border-top:1px solid #ebeee3;margin:4px 0;width:100%}
@media(min-width:761px){.account-menu{display:none}}
.account-menu svg{width:22px;height:22px}
.settings-inner{max-width:560px}
.settings-group{display:flex;flex-direction:column;padding:4px 16px;border-radius:16px;background:#fffef9f2;border:1px solid #e1e5d7}
.settings-group>b{font-size:12px;font-weight:650;letter-spacing:.8px;text-transform:uppercase;color:#65715b;padding:12px 0 4px}
.settings-group[hidden]{display:none}
.settings-row{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:46px;font-size:14px}
.settings-row+.settings-row{border-top:1px solid #ebeee3}
.settings-row span{color:#5f6b57}
.settings-row strong{font-weight:600;overflow-wrap:anywhere;text-align:right}
.settings-row input{width:20px;height:20px;accent-color:var(--green)}
.settings-link{font-size:14px;font-weight:600;color:var(--green)}
.settings-note{margin:0 0 12px;font-size:13px;line-height:1.5;color:#5f6b57}
.settings-actions{display:flex;flex-direction:column;gap:10px}
/* The check of the board: a short card in the style of messages (e2-fixes-3, item 4) */
.solution-card{max-width:520px}
.difficulty-techniques{display:none!important}
.difficulty-reason{flex-basis:100%;margin:2px 0 0;padding:10px 12px;border-radius:12px;background:#fffef9;border:1px solid #e1e5d7;font-size:13px;line-height:1.5;color:#46594d}
.difficulty-reason ul{margin:4px 0 6px;padding-left:18px}
.difficulty-reason small{color:#65715b;font-size:12px}
.progress-actions{display:flex;gap:8px;margin-top:6px;flex-wrap:wrap}
.progress-act{padding:6px 10px;border-radius:10px;font-size:12px;font-weight:650;color:#5f6b57}
.progress-act.primary-act{background:#fbefdc;color:#a8641a}
@media(min-width:1100px){
  .board-side .solution-card{max-width:none;width:auto;margin:0;flex-direction:column;align-items:stretch}
  .puzzle:not(.playing) .board-side:not(:has(>:not([hidden]))):before{display:block}
}
@media(min-width:1100px){
  .board-side .solution-card{padding:12px 14px;gap:8px;min-height:0}
  .board-side .solution-card *{white-space:normal}
  .board-side .progress-text{display:flex;flex-direction:column;gap:2px;min-width:0}
  .board-side #progress-detail{white-space:normal;overflow:visible;font-size:12px;line-height:1.4}
  .board-side .difficulty{flex-wrap:wrap;row-gap:6px;padding-top:8px}
}
.daily-day.late span{background:#fff;color:var(--green);box-shadow:inset 0 0 0 2px #9fbf9a;position:relative}
.daily-day.late span:after{content:'✓';position:absolute;right:-3px;bottom:-3px;width:14px;height:14px;border-radius:50%;background:#9fbf9a;color:#fff;font-size:9px;display:grid;place-items:center}
/* Saving and the library menu (docs/roadmap/mockups/e2-fixes-3, item 6) */
.save-bar{display:flex;align-items:center;gap:10px;margin:0 0 8px;padding:7px 8px 7px 12px;border-radius:14px;background:#fff8e8;border:1px solid #f0d49a;font-size:13px;flex-shrink:0}
.save-bar[hidden]{display:none}
.save-bar b{flex:1;font-weight:600;color:#6e4c1c}
.save-bar button{padding:8px 14px;border-radius:10px;background:var(--green);color:#fff;font-size:13px;font-weight:650}
.save-sheet h2,.archive-video h2{margin:0;font-family:Georgia,"Times New Roman",serif;font-weight:400;font-size:24px;color:#253d33}
.save-sheet p{margin:0;font-size:14px;line-height:1.5;color:#5f6b57}
.save-sheet .button{min-height:48px}
.library-menu{width:200px}
.library-menu .danger-item{color:#a8463b}
.library-rename{font:inherit;font-size:15px;font-weight:700;padding:4px 8px;border-radius:8px;border:1px solid #c9d0bf;width:100%;box-sizing:border-box}
.notification-action{flex:none;padding:5px 10px;border-radius:8px;background:#eef1e6;color:var(--green);font-size:13px;font-weight:650;margin-top:-3px}
.notification-action[hidden]{display:none}
/* A pack completed: the celebration (docs/roadmap/mockups/e2-fixes-3, item 1) */
.complete{position:relative;overflow:hidden;background:radial-gradient(circle at 50% 28%,#fff7e6,#f3e9d9 72%)}
.complete-inner{max-width:420px;align-items:center;text-align:center;color:#3d2f20;position:relative;z-index:1}
.complete-picture{display:grid;gap:2px;width:min(180px,50vw);padding:12px;margin-top:20px;background:#fff;border-radius:20px;box-shadow:0 18px 40px #7a5a3a33;transform:rotate(-3deg)}
.complete-picture i{aspect-ratio:1;border-radius:3px;background:#f1ebe0}
.complete-picture.run i.on{animation:piece-in .7s cubic-bezier(.2,.9,.3,1.2) both;animation-delay:var(--d)}
@keyframes piece-in{from{transform:translate(var(--fx),var(--fy)) rotate(40deg) scale(.4);opacity:0}to{transform:none;opacity:1}}
.complete h1{color:#3d2f20;margin-top:6px}
.complete-inner p{margin:0;font-size:14px;line-height:1.5;color:#7a6650}
.complete-prize{width:100%;display:grid;grid-template-columns:1fr 1fr;gap:10px}
.complete-prize>div{display:flex;flex-direction:column;gap:4px;padding:12px 14px;border-radius:16px;background:#fff;border:1px solid #f0e2c9;text-align:left}
.complete-prize b{font-size:15px}.complete-prize small{font-size:12px;color:#7a6650}
.complete-bonus{border:2px dashed #e0a72e!important;background:#fff8e8!important}
.complete-bonus[hidden]{display:none!important}
.complete-go{width:100%;min-height:50px;font-size:15px}
.complete-confetti{position:absolute;inset:0;pointer-events:none}
.complete-confetti i{position:absolute;top:-20px;width:9px;height:9px;border-radius:2px;opacity:0}
.complete-confetti.run i{animation:confetti 2.4s ease-in forwards;animation-delay:var(--d)}
@keyframes confetti{0%{opacity:1;transform:translateY(0) rotate(0)}100%{opacity:0;transform:translateY(105vh) rotate(var(--r))}}
.pack-bonus{border:2px dashed #e0a72e;background:#fff8e8;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;color:#a8641a}
.pack-bonus strong{font-size:15px}.pack-bonus small{font-size:11px;color:#7d6647}
.pack-bonus.closed{opacity:.6;border-color:#d8cfbf;background:#f6f2ea;color:#9a8466}
@media(prefers-reduced-motion:reduce){.complete-confetti{display:none}}

/* Наборы рядами (docs/roadmap/mockups/e2-catalog) */
.sets .view-inner,.band-view .view-inner{max-width:1180px}
.sets-notes{display:flex;flex-direction:column;gap:8px}.sets-notes:empty{display:none}
.sets-note{display:flex;align-items:center;gap:12px;padding:11px 14px;border-radius:14px;font-size:13px;line-height:1.45}
.sets-note span{flex:1}
.sets-note.offline{background:#faf1dd;border:1px solid #ead9b2;color:#8a6a33}
.sets-note.fresh{background:#e3eedb;border:1px solid #cfdfc2;color:var(--green);font-weight:600}
.sets-note.guest{background:#fffef9;border:1px solid #e1e5d7;color:#5f6b57}.sets-note.guest b{color:#30453b}
.sets-note .button{min-height:40px;padding:9px 16px;border-radius:999px}
.sets-top{display:flex;flex-direction:column;gap:12px}
.sets-continue{display:flex;align-items:center;gap:12px;padding:9px 10px;border-radius:18px;background:#fffef9f2;border:1px solid #e1e5d7;box-shadow:0 8px 24px #3b4f3014}
.sets-continue-cover{flex:none;width:52px;height:52px;border-radius:13px;display:grid;place-items:center}
.sets-continue-cover .pixel-grid{width:58%}
.sets-continue-text{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.sets-continue-text small{font-size:10px;letter-spacing:1.4px;font-weight:700;color:#5a7151}
.sets-continue-text strong{font-size:15px;color:#30453b;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sets-continue-text em{font-style:normal;font-size:12px;color:#5f6b57}
.sets-continue .button{min-height:44px;padding:10px 18px;border-radius:999px;font-size:13px}
.sets-themes{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;margin:0 -16px;padding:0 16px}
.sets-themes::-webkit-scrollbar{display:none}
.theme-chip{flex:none;min-height:40px;padding:8px 14px;border-radius:999px;background:#fffef9;border:1px solid #e1e5d7;font-size:13px;font-weight:600;color:#5f6b57}
.theme-chip[aria-pressed=true]{background:var(--green);border-color:var(--green);color:#fff}
.sets-bands{display:flex;flex-direction:column;gap:20px;margin-top:4px}
section.band-row{display:flex;flex-direction:column;gap:8px;border-radius:16px}
section.band-row.fresh{outline:3px solid #9fc08a;outline-offset:6px;animation:band-fresh 1.6s ease-out 2}
@keyframes band-fresh{50%{outline-color:#9fc08a00}}
.band-head{display:flex;align-items:baseline;gap:8px}
.band-head h2{margin:0;font-size:18px;font-weight:700;color:#253d33}
.band-head small{font-size:12px;color:#65715b}
.band-all{margin-left:auto;font-size:13px;font-weight:650;color:var(--green);padding:10px 0}
.band-arrows{display:none;gap:6px;margin-left:10px}
.band-head small+.band-arrows{margin-left:auto}
.band-arrow{width:34px;height:34px;border-radius:50%;background:#fffef9;border:1px solid #e1e5d7;font-size:17px;color:#5f6b57;align-self:center}
@media(min-width:1100px) and (hover:hover){.band-arrows{display:flex}}
.band-track{display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;margin:0 -16px;padding:2px 16px 6px;scroll-padding:0 16px}
.band-track::-webkit-scrollbar{display:none}
.pack-card{flex:none;width:108px;display:flex;flex-direction:column;gap:6px;text-align:left;scroll-snap-align:start;color:#30453b;padding:0;font:inherit}
.pack-card-cover{position:relative;aspect-ratio:1;border-radius:16px;display:grid;place-items:center;background:#eceee6}
.pack-card-cover .pixel-grid{width:56%}
.pack-card strong{font-size:13px;font-weight:650;line-height:1.25;overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow-wrap:anywhere}
.pack-card small{font-size:11px;color:#65715b;margin-top:-4px}
.pack-card small b{color:#8b6011;font-weight:700}
.pack-card-bar{display:block;height:4px;border-radius:2px;background:#e4e9da;overflow:hidden}
.pack-card-bar i{display:block;height:100%;background:var(--green);border-radius:2px}
.pack-card-new{position:absolute;top:7px;left:7px;padding:3px 7px;border-radius:999px;font-size:10px;font-weight:700;background:#fffef9;color:#93621f;box-shadow:0 2px 6px #0001}
.pack-card-done,.pack-card-account{position:absolute;top:7px;right:7px;width:22px;height:22px;border-radius:50%;display:grid;place-items:center}
.pack-card-done{background:var(--green);color:#fff;font-size:12px;font-weight:800}
.pack-card-account{background:#fffef9;color:#7d8a72;box-shadow:0 2px 6px #0001}.pack-card-account svg{width:13px;height:13px}
.pack-card.guest .pack-card-cover>.pixel-grid{filter:saturate(.35);opacity:.75}
.pack-card-soon .pack-card-cover{background:#fffef9;border:1.5px dashed #d5dacb;box-sizing:border-box;font-size:12px;line-height:1.4;color:#65715b;text-align:center}
.pack-card-skeleton .pack-card-cover{background:linear-gradient(90deg,#eceee6,#f4f5ee,#eceee6)}
.pack-card-skeleton strong,.pack-card-skeleton small{height:10px;border-radius:5px;background:#e8eae1}.pack-card-skeleton small{width:60%}
.band-empty{margin:0;padding:12px 14px;border-radius:14px;border:1px dashed #d5dacb;font-size:13px;color:#65715b;line-height:1.45}
.band-locked{display:flex;align-items:center;gap:12px;width:100%;padding:12px 14px;border-radius:16px;background:#eceee6;text-align:left;font:inherit;color:#5f6a58;min-height:56px}
.band-lock-icon{flex:none;width:36px;height:36px;border-radius:50%;background:#fffef9;display:grid;place-items:center;color:#7d8a72}.band-lock-icon svg{width:17px;height:17px}
.band-locked-text{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.band-locked-text strong{font-size:15px;font-weight:650}
.band-locked-text small{font-size:12px;line-height:1.4;color:#65715b}
.band-locked .pack-card-bar{margin-top:4px;background:#dde1d4}
.band-locked.far{padding:10px 14px}
.band-lock h2{margin:0;font-family:Georgia,"Times New Roman",serif;font-weight:400;font-size:24px;color:#253d33}
.band-lock p{margin:0;font-size:14px;line-height:1.5;color:#5f6b57}
.band-lock-steps{display:flex;flex-direction:column;gap:8px}
.band-lock-step{display:flex;align-items:center;gap:10px;font-size:14px}
.band-lock-cover{flex:none;width:40px;height:40px;border-radius:10px;display:grid;place-items:center}.band-lock-cover .pixel-grid{width:60%}
.band-lock-step b{margin-left:auto;font-size:12px;font-weight:600;color:#65715b}.band-lock-step b.done{color:var(--green)}
.band-view-head{display:flex;align-items:center;gap:12px}
.band-view-head .pack-back{width:40px;height:40px;border-radius:50%;background:#fffef9;border:1px solid #e1e5d7;display:grid;place-items:center;color:#5f6b57}
.band-view-head .pack-back svg{width:20px;height:20px}
.band-lead{margin:-8px 0 0;font-size:13px;color:#65715b}
.band-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:16px 12px}
.band-grid .pack-card{width:auto}
@media(max-width:600px){.band-grid{grid-template-columns:1fr 1fr}}
@media(min-width:1100px){.pack-card{width:142px}.sets-top{flex-direction:row;align-items:center}.sets-continue{flex:0 0 420px}.sets-themes{margin:0;padding:0;flex-wrap:wrap}.band-track{margin:0;padding:2px 0 6px;scroll-padding:0}}

/* Пикро+ (docs/roadmap/mockups/e6-plus): чёрно-золотая метка */
.pack-card-plus,.pack-tile-plus,.nav-plus{background:#2b2a24;color:#f3d27a;font-weight:800;border-radius:999px;letter-spacing:.1px}
.pack-card-plus{position:absolute;top:7px;right:7px;padding:3px 7px;font-size:10px}
.pack-tile-plus{padding:3px 8px;font-size:11px}
.nav-plus{padding:6px 11px;font-size:12px;align-self:center}
.pack-tile.plus{background:#fffef9;border:1px dashed #cfc59f;color:#30453b}
.plus-crown,.guest-head .plus-crown{flex:none;width:52px;height:52px;border-radius:16px;background:#2b2a24;color:#f3d27a;display:grid;place-items:center;font-size:26px;font-weight:800}
.plus-perks{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:8px;font-size:14px;line-height:1.45;color:#30453b}
.plus-perks li{display:flex;gap:10px}.plus-perks li:before{content:'✓';flex:none;width:22px;height:22px;border-radius:50%;background:#e3eedb;color:var(--green);display:grid;place-items:center;font-size:12px;font-weight:800}
.plus-soon{margin:0;font-size:13px;line-height:1.45;color:#5f6b57}
.plus-sheet .button{min-height:48px}
/* e32 — the terms of the subscription under the button, the links, the mark of test payments, «not here» */
.plus-terms{margin:0;padding:9px 11px;border-radius:12px;background:#f3f5ec;font-size:12px;line-height:1.45;color:#5f6b57}
.plus-terms[hidden],.plus-links[hidden],.plus-test[hidden]{display:none}
.plus-links{display:flex;gap:16px;justify-content:center;flex-wrap:wrap}
.plus-links a{display:inline-flex;align-items:center;min-height:40px;font-size:13px;font-weight:700;color:var(--green);text-decoration:none}
.plus-test{align-self:center;font-size:10.5px;font-weight:800;letter-spacing:.8px;color:#8a5a1c;background:#fbefdc;border-radius:999px;padding:3px 10px}
.plus-nowhere{padding:10px 12px;border:1px solid #ecd9b8;background:#fdf6e9;border-radius:14px;color:#5a4a2a}
.plus-nowhere b{color:#3d3220}
/* e32 — what an account loses when deleted, and its subscription of a store */
.account-confirm-loss{padding:10px 12px;border-radius:12px;background:#fdf6e9;border:1px solid #ecd9b8;color:#5a4a2a;font-size:13px}
.account-confirm-loss[hidden],.account-confirm-manage[hidden]{display:none}
.account-confirm-loss b{color:#3d3220}
.account-confirm-loss span{display:block;margin-top:6px}
html[data-theme=dark] .plus-terms{background:#212a25;color:#c2cabd}
html[data-theme=dark] .plus-test{background:#3a2c18;color:#e9b56a}
html[data-theme=dark] .plus-nowhere,html[data-theme=dark] .account-confirm-loss{background:#2c2618;border-color:#4a3f26;color:#d9c9a5}
html[data-theme=dark] .plus-nowhere b,html[data-theme=dark] .account-confirm-loss b{color:#efe2c4}
.ad-demo h2{margin:0;font-family:Georgia,"Times New Roman",serif;font-weight:400;font-size:24px;color:#253d33}
.ad-demo p{margin:0;font-size:14px;color:#5f6b57;padding:40px 0;text-align:center;border-radius:14px;background:repeating-linear-gradient(135deg,#eceee6 0 8px,#f4f5ee 8px 16px)}
.library-local{flex:none;align-self:center;font-size:11px;font-weight:700;padding:3px 8px;border-radius:999px;background:#eceee6;color:#7d8a72}
.sets-note-hide{flex:none;width:40px;height:40px;border-radius:50%;font-size:20px;color:#65715b}
.sets-note.plus{background:linear-gradient(135deg,#2f3a32,#24302a);border:0;color:#f6f1df}.sets-note.plus b{color:#f3d27a}.sets-note.plus .button{background:linear-gradient(#f3d27a,#d9b04f);color:#2b2a24}.sets-note.plus .sets-note-hide{color:#c9cdb8}
.plus-prices{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.plus-prices button{position:relative;text-align:left;border:1.5px solid #e1e5d7;border-radius:14px;padding:10px 12px;font-size:12px;color:#5f6b57;background:#fffef9;min-height:56px}
.plus-prices strong{display:block;font-size:17px;color:#30453b}
.plus-prices button[aria-checked=true]{border-color:var(--green);background:#f3f8ee}
.plus-prices i{position:absolute;top:-9px;right:8px;font-style:normal;font-size:10px;font-weight:800;background:var(--green);color:#fff;padding:2px 7px;border-radius:999px}
/* Страница не найдена (docs/roadmap/mockups/e7-notfound) */
.nf{min-height:100%;box-sizing:border-box;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;padding:32px 16px;text-align:center}
.nf-eyebrow{font-size:10px;letter-spacing:1.6px;font-weight:700;color:#5a7151;background:#eef2e4;padding:4px 10px;border-radius:999px}
.nf-board{background:#fffef9;border:1px solid #e1e5d7;border-radius:18px;padding:16px;box-shadow:0 14px 36px #3b4f3018}
.nf-board table{border-collapse:collapse;font-size:12px;font-weight:600;color:#5f6d54;font-variant-numeric:tabular-nums}
.nf-board td{width:22px;height:22px;border:1px solid #d6dccb;padding:0;background:#fffffb;color:#a5ae9a;text-align:center;font-size:13px;line-height:1}
.nf-board td.on{background:#295c47}
.nf-board th{font-weight:600;padding:0 5px;text-align:right;white-space:nowrap}.nf-board thead th{text-align:center;vertical-align:bottom;padding:0 0 3px}
.nf-title{margin:4px 0 0;font-family:Georgia,"Times New Roman",serif;font-weight:400;font-size:clamp(28px,4vw,38px);color:#253d33}
.nf-text{margin:0;font-size:15px;line-height:1.5;color:#5f6b57;max-width:320px}
.nf-actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:center}
.nf-actions a{display:inline-flex;align-items:center;min-height:46px;padding:0 22px;border-radius:999px;font-size:14px;font-weight:650;text-decoration:none}
.nf-actions .nf-home{background:linear-gradient(135deg,#367457,#245640);color:#fff}
.nf-actions .nf-sets{border:1px solid #e1e5d7;background:#fffef9;color:#30453b}
@media(max-width:400px){.nf-board td{width:18px;height:18px}}
@media(max-width:600px){.nav-plus{display:none!important}}
/* Weekly league (docs/roadmap/mockups/e4-league; card on «Сегодня» — Main, d-today) */
.today-league .today-league-head{display:flex;align-items:baseline;justify-content:space-between;gap:8px}
.today-league .today-league-head small{display:none;margin:0;flex:none;font-size:12px;color:#65715b}
.today-card-icon.league{background:#e9ecef;color:#7b8794}
.today-league-rows{display:none;flex-direction:column;margin-top:8px}
.league-inner{max-width:520px;display:flex;flex-direction:column;gap:14px}
.league-heading{display:flex;flex-direction:column}
.league-heading .view-title{margin:0}
.league-meta{font-size:12px;color:#65715b}
.league-result{margin:0;padding:12px 14px;border-radius:14px;background:#eef2e4;color:#30453b;font-size:14px;line-height:1.4}
.league-result[data-moved="1"]{background:#e3eedb;color:#245640;font-weight:600}
.league-result[data-moved="-1"]{background:#f6e3dc;color:#8a3f2a}
.league-board{list-style:none;margin:0;padding:4px 12px;border-radius:16px;background:#fffef9f2;border:1px solid #e1e5d7;display:flex;flex-direction:column}
.league-player{display:flex;align-items:center;gap:10px;padding:7px 6px;margin:0 -6px;border-radius:10px;min-height:30px}
.league-player.you{background:#e3eedb}
.league-player.you .league-name{font-weight:700}
.league-rank{width:24px;text-align:center;font-size:13px;font-weight:700;color:#65715b;font-variant-numeric:tabular-nums}
.league-avatar{flex:none;width:30px;height:30px;border-radius:50%;display:grid;place-items:center;font-size:13px;font-weight:700;color:#fff}
.league-name{flex:1;min-width:0;font-size:14px;font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.league-xp{font-size:13px;font-weight:650;color:#4f5f47;font-variant-numeric:tabular-nums}
.league-divider{display:flex;align-items:center;gap:8px;padding:6px 0;font-size:11px;font-weight:700;letter-spacing:.8px}
.league-divider::before,.league-divider::after{content:"";flex:1;height:2px;background:currentColor;opacity:.5}
.league-divider.up{color:#2f7f55}
.league-divider.down{color:#b0583f}
.league-empty{padding:18px;border-radius:16px;background:#fffef9f2;border:1px solid #e1e5d7;display:flex;flex-direction:column;gap:14px;align-items:flex-start}
.league-empty p{margin:0;font-size:14px;line-height:1.5;color:#30453b}
@media(min-width:1100px){

  .today-league-rows{display:flex}
  .today-league:has(.today-league-rows:not(:empty)) #today-league-note,.today-league .today-league-place{display:none}
  .today-league{padding:14px 18px;gap:14px;align-items:center}
  .today-league .today-league-head small{display:block}
  .today-league-when{display:none}
  .today-league-rows .league-player{padding:5px 8px;margin:0 -8px}
  .today-league-rows .league-avatar{width:28px;height:28px;font-size:12px}
}
/* Community (docs/roadmap/mockups/e5-community, e5-puzzle, e5-publish) */
.community-inner{display:flex;flex-direction:column;gap:12px}
.community-head{display:flex;align-items:center;gap:12px}
.community-head .view-title{margin:0}
.community-search{display:flex;align-items:center;gap:8px;height:44px;padding:0 12px;border-radius:12px;background:#fff;border:1px solid #e1e5d7;color:#65715b}
.community-search svg{width:18px;height:18px;flex:none}
.community-search input{flex:1;min-width:0;border:0;outline:0;background:none;font:inherit;font-size:14px;color:#30453b}
.community-chips{display:flex;flex-wrap:wrap;gap:6px}
.community-chips button{min-height:40px;padding:0 14px;border-radius:999px;border:1px solid #dfe3d6;background:#fff;font:inherit;font-size:13px;color:#4f5f47}
.community-chips button[aria-pressed=true],.community-chips button[aria-checked=true]{background:#30453b;border-color:#30453b;color:#fff;font-weight:650}
.community-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:12px}
.community-card{display:flex;flex-direction:column;gap:8px;padding:10px;border-radius:16px;background:#fffef9f2;border:1px solid #e1e5d7;color:#30453b;text-decoration:none}
.community-card b{font-size:13px;font-weight:600}
.community-card-meta{display:flex;align-items:center;gap:6px}
.community-card-meta small{font-size:11px;color:#5f6b57}
.community-card-stats{display:flex;justify-content:space-between;font-size:11px;color:#65715b}
.difficulty-tier.small i{width:7px;height:7px;border-radius:1px}
.community-board,.cpuzzle-board{position:relative;display:block;width:100%;border-radius:10px;background-color:#fbfcf8;
  background-image:linear-gradient(90deg,#e4e8dc 1px,transparent 1px),linear-gradient(#e4e8dc 1px,transparent 1px);
  background-size:calc(100% / var(--w)) calc(100% / var(--h));overflow:hidden;border:1px solid #e4e8dc}
.community-board .pixel-grid,.cpuzzle-board .pixel-grid{position:absolute;inset:0;height:100%}
.community-board.unknown::after,.cpuzzle-board.unknown::after{content:"?";position:absolute;inset:0;display:grid;place-items:center;font-family:Georgia,serif;font-size:34px;color:#a3ad98}
.community-more{align-self:center;min-height:44px}
.cpuzzle-inner,.publish-inner{max-width:520px;display:flex;flex-direction:column;gap:14px}
.cpuzzle-top{position:relative;display:flex;align-items:center}
.cpuzzle-number{margin-left:auto;font-size:12px;color:#65715b}
.cpuzzle-more{width:44px;height:44px;display:grid;place-items:center;color:#30453b}
.cpuzzle-more svg{width:22px;height:22px}
.cpuzzle-menu{position:absolute;right:0;top:46px;z-index:5;padding:6px;border-radius:12px;background:#fffef9;border:1px solid #e1e5d7;box-shadow:0 12px 30px #34422c26}
.cpuzzle-menu button{min-height:44px;padding:0 16px;font:inherit;font-size:14px;color:#30453b;text-align:left}
.cpuzzle-card{display:flex;flex-direction:column;align-items:center;gap:12px;padding:16px;border-radius:18px;background:#fffef9;border:1px solid #e1e5d6;box-shadow:0 22px 50px #3b4f3016}
.cpuzzle-board{width:min(220px,70vw);border:2px solid #7d8f71;border-radius:4px}
.cpuzzle-board.unknown::after{font-size:64px;color:#7d8f7159}
.cpuzzle-caption{display:flex;flex-direction:column;align-items:center;gap:2px;text-align:center}
.cpuzzle-caption b{font-family:Georgia,serif;font-weight:400;font-size:22px;color:#253d33}
.cpuzzle-caption span{font-size:12px;color:#5f6b57}
.cpuzzle-author{display:flex;align-items:center;gap:10px}
.cpuzzle-author .league-avatar{width:40px;height:40px;font-size:15px}
.cpuzzle-author>div{flex:1;min-width:0;display:flex;flex-direction:column}
.cpuzzle-author b{font-size:14px;font-weight:650}
.cpuzzle-author span:not(.league-avatar){font-size:12px;color:#65715b}
.cpuzzle-follow{min-height:40px;padding:0 14px;border-radius:999px;border:1px solid var(--green);background:none;color:var(--green);font:inherit;font-size:13px;font-weight:650}
.cpuzzle-follow[aria-pressed=true]{background:#e3eedb;border-color:#e3eedb}
.cpuzzle-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));background:#fffef9f2;border:1px solid #e1e5d7;border-radius:16px}
.cpuzzle-stats div{display:flex;flex-direction:column;align-items:center;padding:10px 0}
.cpuzzle-stats div+div{border-left:1px solid #ebeee3}
.cpuzzle-stats b{font-size:17px;font-weight:700;font-variant-numeric:tabular-nums}
.cpuzzle-stats span{font-size:11px;color:#65715b}
.cpuzzle-levels{display:flex;flex-direction:column;gap:8px;padding:12px 14px;border-radius:16px;background:#fffef9f2;border:1px solid #e1e5d7}
.cpuzzle-levels>div{display:flex;align-items:center;gap:10px;font-size:13px}
.cpuzzle-levels>div>span:first-child{width:92px;color:#5f6b57}
.cpuzzle-levels b{font-weight:650}
.cpuzzle-levels small{margin-left:auto;font-size:11px;color:#65715b}
.difficulty-tier.players i.on{background:#c98a2e}
.cpuzzle-limit{display:flex;flex-direction:column;gap:10px;padding:14px;border-radius:14px;background:#fbefdc;color:#6e4c1c}
.cpuzzle-limit p{margin:0;font-size:13px;line-height:1.45}
.cpuzzle-limit div{display:flex;gap:8px;flex-wrap:wrap}
.cpuzzle-actions{display:flex;gap:8px}
.cpuzzle-actions .cpuzzle-play{flex:1}
.cpuzzle-like{flex:none}
.cpuzzle-like{width:52px;height:52px;border-radius:50%;border:1px solid #d7ddcf;background:#fffdf7;color:#c0563f;display:grid;place-items:center}
.cpuzzle-like svg{width:22px;height:22px}
.cpuzzle-like[aria-pressed=true] svg{fill:currentColor}
.cpuzzle-play{min-height:52px;font-size:16px}
.publish-top{display:flex;gap:14px;align-items:center}
.publish-picture{flex:none;width:92px;padding:8px;border-radius:14px;background:#fffef9;border:1px solid #e1e5d6;box-sizing:border-box}
.publish-field{flex:1;display:flex;flex-direction:column;gap:6px}
.publish-field>span{font-size:11px;font-weight:650;letter-spacing:1px;color:#65715b}
.publish-field input{height:44px;padding:0 12px;border-radius:12px;border:1px solid #d7ddcf;background:#fff;font:inherit;font-size:15px;color:#30453b}
.publish-field small{font-size:11px;color:#65715b}
.publish-checks{background:#fffef9f2;border:1px solid #e1e5d7;border-radius:16px;padding:2px 14px}
.publish-check{display:flex;gap:10px;align-items:center;padding:11px 0}
.publish-check+.publish-check{border-top:1px solid #ebeee3}
.publish-check>span{width:24px;height:24px;border-radius:50%;display:grid;place-items:center;flex:none;font-size:13px;font-weight:800;background:#eef1e6;color:#65715b}
.publish-check.ok>span{background:#e3eedb;color:#295c47}
.publish-check.bad>span{background:#f6e3dc;color:#b0583f}
.publish-check div{display:flex;flex-direction:column}
.publish-check b{font-size:14px;font-weight:500}
.publish-check small{font-size:12px;color:#65715b}
.publish-mine{display:flex;gap:10px;align-items:flex-start;padding:12px 14px;border-radius:14px;background:#fbefdc;font-size:13px;line-height:1.45;color:#6e4c1c}
.publish-mine input{width:20px;height:20px;margin:0;accent-color:#a8641a;flex:none}
.publish-send{min-height:54px;font-size:16px}
.publish-note{text-align:center;font-size:12px;color:#65715b}
.draw-publish{align-self:flex-start;min-height:40px;margin-top:4px;padding:0 14px;border-radius:999px;border:1px solid var(--green);color:var(--green);font:inherit;font-size:13px;font-weight:650;background:none}
@media(min-width:1100px){.community-grid{grid-template-columns:repeat(auto-fill,minmax(190px,1fr))}}
.community-pick{display:flex;gap:14px;align-items:center;padding:14px;border-radius:18px;background:#e6eef5;border:1px solid #d3e0ea;color:#2d3f4f;text-align:left;font:inherit}
.community-pick-art{flex:none;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px;width:64px}
.community-pick-art i{aspect-ratio:1;border-radius:6px;background:#a9c2d8}
.community-pick-art i:nth-child(1),.community-pick-art i:nth-child(4){background:#4d7ea8}
.community-pick-text{display:flex;flex-direction:column;gap:3px}
.community-pick-text small{font-size:10px;font-weight:700;letter-spacing:1.4px;color:#4d7ea8}
.community-pick-text b{font-family:Georgia,serif;font-weight:400;font-size:20px}
.community-pick-text span{font-size:12px;color:#5a6e80}
.community-pick-head{display:flex;align-items:center;justify-content:space-between;gap:10px}
.community-pick-head b{font-size:15px;font-weight:650}
.community-pick-head button{min-height:40px}
/* The best three of the day in the card of «Сегодня» (docs/roadmap/mockups/e5-community-2, item 1). */
.today-podium{display:flex;flex-direction:column;gap:5px;max-width:360px;padding:9px 12px;border-radius:12px;background:#ffffff17;font-size:13px}
.today-podium-head{display:flex;justify-content:space-between;gap:8px;font-size:10px;font-weight:700;letter-spacing:1.2px;text-transform:uppercase;opacity:.78}
.today-podium-rows{display:flex;flex-direction:column;gap:4px}
.today-podium-row{display:flex;align-items:center;gap:8px}
.today-podium-row b{width:20px;height:20px;flex:none;border-radius:50%;display:grid;place-items:center;font-size:10px;color:#253d33;background:#ffffffd9}
.today-podium-row:nth-child(1) b{background:#f1cf6b}.today-podium-row:nth-child(2) b{background:#d9dfd5}.today-podium-row:nth-child(3) b{background:#e4b38a}
.today-podium-row span:last-child{margin-left:auto;font-variant-numeric:tabular-nums;font-weight:650}
.today-podium-row.you{font-weight:700}
.today-podium-row.you:not(:nth-child(-n+3)){border-top:1px dashed #ffffff4d;padding-top:5px}
.today-podium-row.you:not(:nth-child(-n+3)) b{background:#fff}
.today-podium-note{font-size:12px;opacity:.82}
/* Cards and the ranking of a puzzle (docs/roadmap/mockups/e5-community-2, items 2–3). */
.community-card .community-card-title{font-size:13px;font-weight:650;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.community-card-author{margin-top:-6px;font-size:11px;color:#5f6b57}
.community-card-stats span:last-child{font-variant-numeric:tabular-nums;font-weight:600;color:#5f6b57}
.cpuzzle-rank{display:flex;flex-direction:column;gap:6px;padding:12px 14px;background:#fffef9f2;border:1px solid #e1e5d7;border-radius:16px}
.cpuzzle-rank-head{display:flex;justify-content:space-between;align-items:baseline}
.cpuzzle-rank-head b{font-size:14px}.cpuzzle-rank-head small{font-size:12px;color:#65715b}
.cpuzzle-rank-rows{display:flex;flex-direction:column}
.cpuzzle-rank-row{display:flex;align-items:center;gap:10px;padding:7px 2px;font-size:13px;border-bottom:1px solid #eef0e8}
.cpuzzle-rank-row:last-child{border-bottom:0}
.cpuzzle-rank-row b{width:22px;height:22px;flex:none;border-radius:50%;display:grid;place-items:center;font-size:11px;background:#eef1e6}
.cpuzzle-rank-row:nth-child(1) b{background:#f1cf6b}.cpuzzle-rank-row:nth-child(2) b{background:#d9dfd5}.cpuzzle-rank-row:nth-child(3) b{background:#e4b38a}
.cpuzzle-rank-row span:last-child{margin-left:auto;font-variant-numeric:tabular-nums;font-weight:650}
.cpuzzle-rank-row.you{background:#eef5e8;border-radius:10px;padding:7px 8px;font-weight:700}
.cpuzzle-rank-gap{text-align:center;color:#b5bfa9;font-size:12px}
.cpuzzle-rank-note{margin:0;font-size:12px;line-height:1.4;color:#5f6b57}
@media(min-width:1100px){
  .cpuzzle-inner{max-width:1000px;display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:14px 24px;align-items:start}
  .cpuzzle-inner>*{grid-column:2}
  .cpuzzle-inner>.cpuzzle-top{grid-column:1/-1}
  .cpuzzle-inner>.cpuzzle-card{grid-column:1;grid-row:2/span 9}
}
/* Publishing (docs/roadmap/mockups/e5-community-2, items 2 and 4). */
.community-publish{display:flex;align-items:center;gap:14px;width:100%;padding:14px 16px;border-radius:18px;border:1.5px dashed #b9c8ad;background:#fffef9;color:#30453b;font:inherit;text-align:left;cursor:pointer}
.community-publish:hover{border-color:#295c47}
.community-publish-icon{width:44px;height:44px;flex:none;border-radius:14px;display:grid;place-items:center;background:#295c47;color:#fff}
.community-publish-icon svg{width:22px;height:22px}
.community-publish-text{display:flex;flex-direction:column;gap:3px}
.community-publish-text b{font-size:15px}
.community-publish-text small{font-size:13px;line-height:1.4;color:#5f6b57}
.publish-source-label{margin:14px 0 6px;font-size:11px;font-weight:700;letter-spacing:1.2px;text-transform:uppercase;color:#5a7151}
.publish-source-list{max-height:min(40vh,320px);overflow:auto}
.publish-plus{display:flex;flex-direction:column;gap:10px;padding:16px;border-radius:16px;background:#253d33;color:#fff}
.publish-plus b{font-size:16px}
.publish-plus p{margin:0;font-size:13px;line-height:1.45;opacity:.88}
.publish-plus .button{background:#f1cf6b;color:#253d33}
.publish-plus small{font-size:12px;opacity:.75}
.publish.locked .publish-field,.publish.locked .publish-mine,.publish.locked .publish-send,.publish.locked .publish-note,.publish.locked #publish-error{display:none}
#settings-plan{margin-left:auto}
#settings-plus{margin-left:12px}
/* On a phone the check of a scan is one card of two lines: what happened with its action on the right,
   then the level with «Почему?»; «Сверить фото» is the photo button of the dock. */
@media(max-width:760px){
  .solution-card .progress-text{display:grid;grid-template-columns:minmax(0,1fr) auto;column-gap:8px;align-items:center}
  .solution-card #solution-ready,.solution-card #progress-detail{grid-column:1}
  .solution-card #progress-actions{grid-column:2;grid-row:1/span 2;margin:0}
  .solution-card #progress-photo{display:none}
  .solution-card[data-status=clues] #progress-detail{white-space:normal}
  .solution-card .difficulty{flex-wrap:nowrap;gap:6px;padding-top:6px}
  .solution-card #difficulty-meta{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
  .solution-card .difficulty-why{margin-left:auto;flex:none}
  .save-bar{padding:4px 4px 4px 12px;margin-bottom:6px;font-size:12px}
  .save-bar button{padding:6px 12px;font-size:12px}
}
.streak-sets{align-self:center;padding:10px 14px;font-size:14px;font-weight:600;color:var(--green)}
/* Wide screens are filled (AGENTS.md): the day beside its ranking, the league beside its rules. */
.league-rules{display:flex;flex-direction:column;gap:8px;padding:14px 16px;border-radius:16px;border:1.5px dashed #d7ddcf;font-size:13px;line-height:1.45;color:#5f6b57}
.league-rules>b{font-size:14px;color:#30453b}
.league-rules ul{margin:0;padding-left:18px;display:flex;flex-direction:column;gap:6px}
.league-rules li b{color:#30453b}
@media(min-width:1100px){
  .daily-inner{max-width:980px;display:grid;grid-template-columns:minmax(0,1fr) 400px;gap:14px 32px;align-items:start}
  .daily-inner>*{grid-column:1;margin-top:0;margin-bottom:0}
  .daily-inner>.print-head{grid-column:1/-1}
  .daily-inner>.daily-side{grid-column:2;grid-row:2/span 6}
  .league-inner{max-width:980px;display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:14px 32px;align-items:start}
  .league-inner>*{grid-column:1}
  .league-inner>.print-head{grid-column:1/-1}
}
.daily-side{display:flex;flex-direction:column;gap:inherit}
/* The puzzle of the day, filled (docs/roadmap/mockups/e4-daily-2): the share card, the next one, the spread of times, your stats. */
.daily-shareblock{display:flex;gap:18px;align-items:stretch;padding:12px;border-radius:18px;background:#fffef9f2;border:1px solid #e1e5d7}
.daily-share-image{width:112px;aspect-ratio:9/16;border-radius:12px;box-shadow:0 10px 26px #1d463533;flex:none}
.daily-share-text{display:flex;flex-direction:column;gap:10px;min-width:0;flex:1;align-self:stretch;padding:4px 0}
.daily-share-eyebrow{font-size:10px;font-weight:700;letter-spacing:1.6px;color:#5a7151}
.daily-share-title{margin-top:-4px;font-family:Georgia,"Times New Roman",serif;font-weight:400;font-size:26px;line-height:1.1;color:#253d33}
.daily-share-facts{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:8px;font-size:13px;line-height:1.35;color:#46594d}
.daily-share-facts li{display:flex;gap:10px;align-items:flex-start}
.daily-share-facts i{flex:none;width:26px;height:26px;border-radius:8px;display:grid;place-items:center;background:#eef2e4;font-style:normal;font-size:13px;color:var(--green)}
.daily-share-facts span{padding-top:4px}
.daily-share-actions{margin-top:auto;display:flex;gap:8px;flex-wrap:wrap}
.daily-share-text .daily-share{color:#fff;display:inline-flex;gap:8px;border-radius:999px;padding:11px 18px;font-size:14px}
.daily-share-text .daily-share svg{width:16px;height:16px}
.daily-share-save{border-radius:999px;padding:11px 18px;font-size:14px}
.daily-next{margin:0;padding:10px 14px;border-radius:14px;background:#fffef9f2;border:1px solid #e1e5d7;font-size:13px;color:#46594d;text-align:center}
.daily-panel{display:flex;flex-direction:column;gap:8px;padding:12px 14px;border-radius:16px;background:#fffef9f2;border:1px solid #e1e5d7}
.daily-panel>b{font-size:11px;letter-spacing:1.2px;text-transform:uppercase;color:#5a7151}
.daily-spread-bars{display:flex;align-items:flex-end;gap:4px;height:70px}
.daily-spread-bars i{flex:1;background:#dfe7d6;border-radius:4px 4px 0 0}
.daily-spread-bars i.you{background:var(--green)}
.daily-spread-labels{display:flex;justify-content:space-between;font-size:11px;color:#65715b;font-variant-numeric:tabular-nums}
.daily-spread-labels span:nth-child(2){color:var(--green);font-weight:650}
.daily-mine-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));text-align:center}
.daily-mine-stats strong{display:block;font-size:20px;color:#253d33;font-variant-numeric:tabular-nums}
.daily-mine-stats span{font-size:11px;color:#5f6b57}
.daily-share-image{align-self:flex-start}
.daily-share-facts i svg{width:15px;height:15px}
@media(max-width:600px){
  .daily-shareblock{display:grid;grid-template-columns:96px minmax(0,1fr);gap:10px 14px;align-items:start}
  .daily-share-text{display:contents}
  .daily-share-image{width:96px;grid-row:1/span 3}
  .daily-share-eyebrow,.daily-share-title,.daily-share-facts{grid-column:2}
  .daily-share-title{font-size:22px;margin-top:0}
  .daily-share-actions{grid-column:1/-1;flex-wrap:nowrap}
  .daily-share-actions .button{justify-content:center;white-space:nowrap;padding:11px 14px}
  .daily-share-actions .daily-share{flex:1}
}
/* The league, filled (docs/roadmap/mockups/e4-league-2) */
.today-league-chip{align-self:flex-start;margin-top:8px;padding:6px 12px;border-radius:999px;background:var(--green);color:#fff;font-size:12px;font-weight:700}
.today-league-bar,.league-week-bar{display:block;height:6px;margin-top:8px;border-radius:3px;background:#eceee6;overflow:hidden}
.today-league-bar i,.league-week-bar i{display:block;height:100%;border-radius:3px;background:#b07a50}
.league-shield{width:46px;height:52px;flex:none;align-self:center}
.league-shield svg{width:100%;height:100%;filter:drop-shadow(0 6px 10px #6b4a2a26)}
.league-week{display:flex;flex-direction:column;gap:10px;padding:18px 20px;border-radius:18px;background:linear-gradient(135deg,#f6e3d1,#ecd0b5);border:1px solid #e3c6a8;color:#4b3320}
.league-week[data-tier="1"]{background:linear-gradient(135deg,#f1f3f6,#dde2e8);border-color:#cfd5dc;color:#39424d}
.league-week[data-tier="2"]{background:linear-gradient(135deg,#fbf0cf,#f2dc94);border-color:#e6cd7f;color:#4d3d10}
.league-week[data-tier="3"]{background:linear-gradient(135deg,#e2f3e8,#bfe2cc);border-color:#a9d4b9;color:#1f4d33}
.league-week[data-tier="4"]{background:linear-gradient(135deg,#efe9fa,#d9cdf1);border-color:#c9bbe8;color:#3b2d63}
.league-week-label{font-size:10px;font-weight:700;letter-spacing:1.6px;opacity:.7}
.league-week-title{font-family:Georgia,"Times New Roman",serif;font-weight:400;font-size:28px;line-height:1.1}
.league-week-text{margin:0;font-size:14px;line-height:1.5}
.league-week-facts{display:flex;flex-wrap:wrap;gap:8px 22px}
.league-week-facts div{display:flex;flex-direction:column;font-size:12px;opacity:.85}
.league-week-facts b{font-size:22px;font-weight:800;opacity:1}
.league-week .league-week-bar{background:#ffffff8c}
.league-week-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:4px}
.league-week-actions .button{border-radius:999px;padding:11px 18px;font-size:14px}
.league-week-actions .button.secondary{background:#fffef9}
.league-panel{display:flex;flex-direction:column;gap:8px;padding:14px 16px;border-radius:16px;background:#fffef9f2;border:1px solid #e1e5d7}
.league-panel>b{font-size:11px;font-weight:700;letter-spacing:1.2px;text-transform:uppercase;color:#5a7151}
.league-panel>small{font-size:12px;line-height:1.4;color:#65715b}
.league-ladder{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:4px}
.league-ladder li{display:flex;align-items:center;gap:10px;padding:6px 8px;border-radius:10px;font-size:14px;color:#5f6b57}
.league-ladder li svg{width:22px;height:24px;flex:none}
.league-ladder li small{margin-left:auto;font-size:12px;color:#65715b}
.league-ladder li.here{background:#f3ece2;color:#30453b;font-weight:700}
.league-ladder li.here small{color:#80542c;font-weight:650}
.league-xp{width:100%;border-collapse:collapse;font-size:13px}
.league-xp td{padding:7px 2px;border-bottom:1px solid #eef0e8}
.league-xp tr:last-child td{border-bottom:0}
.league-xp td:first-child{display:flex;align-items:center;gap:8px}
.league-xp td:last-child{text-align:right;font-weight:650;font-variant-numeric:tabular-nums}
@media(min-width:1100px){
  .league-inner>.league-panel,.league-inner>.league-rules{grid-column:2}
  .league-inner>#league-ladder{grid-row:2}
  .league-inner>#league-xp{grid-row:3}
  .league-inner>.league-rules{grid-row:4/span 4}
}
/* A lighter dock: buttons a size smaller, «Поделиться» among the tools (still 44 px to tap on a phone). */
.action-dock .paint-tools button,.action-dock .dock-quiet,.action-dock .tool-button{height:46px;min-width:46px;gap:2px;padding:4px 5px}
.action-dock .tool-button svg{width:19px;height:19px}
.action-dock .dock-hint,.action-dock .dock-primary .primary{min-height:44px}
.action-dock .dock-share{display:inline-flex;align-items:center;justify-content:center;gap:6px;color:var(--green);font-weight:650;font-size:12px}
.action-dock .dock-share[hidden]{display:none}
.action-dock .dock-share svg{width:18px;height:18px}
@media(max-width:600px){
  .dock-primary:has(.dock-share:not([hidden])){grid-template-columns:44px 1fr 1fr}
  .action-dock .dock-share{padding:0;width:44px}
  .dock-share-label{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
  .action-dock .paint-tools button,.action-dock .dock-quiet,.action-dock .tool-button{height:44px;min-width:34px}
  .action-dock .dock-hint,.action-dock .dock-primary .primary{min-height:44px;padding:10px 6px}
}
/* The line hint step by step (docs/roadmap/mockups/e2-hints-2) */
.hint-player{display:flex;flex-direction:column;gap:10px}
.hint-track{position:relative;display:grid;grid-template-columns:repeat(var(--cells),minmax(0,1fr));gap:2px;height:30px}
.hint-track>i{border-radius:3px;background:#fffef9;border:1px solid #cfd6c5;transition:background .35s,box-shadow .35s}
.hint-track>i.known{background:#7d9a86;border-color:#7d9a86}
.hint-track>i.cross{background:#eceee6}
.hint-track>i.lit{background:repeating-linear-gradient(135deg,#9fc08a 0 3px,#e3eedb 3px 6px);box-shadow:inset 0 0 0 2px #295c47}
.hint-track>i.lit-cross{background:#f1f3e9;box-shadow:inset 0 0 0 2px #a5ae9a}
.hint-bar{position:absolute;top:3px;height:24px;border-radius:5px;display:grid;place-items:center;font-size:11px;font-weight:800;color:#fff;transition:opacity .35s;animation:hint-bar-in .5s ease-out;pointer-events:none}
.hint-bar.left{background:#5b7fa3d9}
.hint-bar.right{background:#c98a2ed9}
.hint-track.settled .hint-bar{opacity:.25}
@keyframes hint-bar-in{from{transform:translateX(-14px);opacity:0}}
.hint-bar.right{animation-name:hint-bar-in-right}
@keyframes hint-bar-in-right{from{transform:translateX(14px);opacity:0}}
.hint-player-bar{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.hint-play{display:inline-flex;align-items:center;gap:8px;min-height:40px;padding:0 16px 0 6px;border-radius:999px;background:var(--green);color:#fff;font-size:13px;font-weight:700}
.hint-play-icon{width:28px;height:28px;border-radius:50%;background:#ffffff26;position:relative;flex:none}
.hint-play-icon.play:before{content:'';position:absolute;left:11px;top:8px;border-left:9px solid #fff;border-top:6px solid transparent;border-bottom:6px solid transparent}
.hint-play-icon.pause:before,.hint-play-icon.pause:after{content:'';position:absolute;top:8px;width:3px;height:12px;border-radius:1px;background:#fff}
.hint-play-icon.pause:before{left:10px}.hint-play-icon.pause:after{left:15px}
.hint-play-icon.again:before{content:'↻';position:absolute;inset:0;display:grid;place-items:center;font-size:15px;font-weight:700}
.hint-steps{display:flex;gap:6px;flex-wrap:wrap}
.hint-step{display:inline-flex;align-items:center;gap:6px;min-height:36px;padding:0 10px 0 4px;border-radius:999px;border:1px solid #d7ddcf;background:#fffef9;font-size:12px;font-weight:650;color:#5f6b57}
.hint-step b{width:24px;height:24px;border-radius:50%;display:grid;place-items:center;background:#eceee6;color:#5f6b57;font-size:11px}
.hint-step:hover{border-color:#9fbf8f}
.hint-step.done{color:#30453b}.hint-step.done b{background:#c9dcbf;color:#245640}
.hint-step.current{border-color:var(--green);background:#eef5e8;color:#245640}.hint-step.current b{background:var(--green);color:#fff}
.hint-step-text{margin:0;min-height:38px;font-size:13px;line-height:1.45;color:#46594d}
/* «Проверить» and the hints left, in play */
.puzzle.playing .play-check:not([hidden]){display:inline-flex}
.puzzle.playing .play-check{align-items:center;justify-content:center;gap:6px;font-size:13px;font-weight:650}
.puzzle.playing .play-pause{font-size:13px}
.play-check svg{width:17px;height:17px;flex:none}
.hint-left{display:inline-grid;place-items:center;min-width:20px;height:20px;margin-left:6px;padding:0 5px;border-radius:10px;background:#e0a72e;color:#fff;font-size:11px;font-weight:800;vertical-align:1px}
@media(max-width:600px){
  .puzzle.playing .dock-primary:has(.play-check:not([hidden])){grid-template-columns:1fr 1fr auto}
  .puzzle.playing .dock-primary:has(.play-check:not([hidden])) .play-pause{padding:10px 12px;font-size:12px}
}
.action-dock .play-check>span{display:inline;font-size:13px;margin:0}
.action-dock .dock-hint>.hint-left:not([hidden]){display:inline-grid;font-size:11px;margin:0 0 0 6px}
/* The hint player on the board itself (docs/roadmap/mockups/e2-hints-2) */
.board td.cell.hp-left{box-shadow:inset 0 0 0 999px #5b7fa333}
.board td.cell.hp-right{box-shadow:inset 0 0 0 999px #c98a2e33}
.board td.cell.hp-left.hp-right{box-shadow:inset 0 0 0 999px #5f8a5a4d}
.board td.cell.hp-layout{box-shadow:inset 0 0 0 999px #7a6aa340}
.board td.cell.hp-assume{box-shadow:inset 0 0 0 3px #c98a2e,inset 0 0 0 999px #fbefdc;animation:hp-pulse 1.2s ease-in-out infinite}
.board td.cell.hp-conflict{box-shadow:inset 0 0 0 999px #f6e3dc}
.board td.cell.hp-conflict.hp-assume{box-shadow:inset 0 0 0 3px #b4493c,inset 0 0 0 999px #f6e3dc}
@keyframes hp-pulse{50%{box-shadow:inset 0 0 0 3px #c98a2e66,inset 0 0 0 999px #fbefdc}}
.hint-bar.layout{background:#7a6aa3d9}
@media(prefers-reduced-motion:reduce){.board td.cell.hp-assume{animation:none}}
/* Wide screens are filled: settings with a side column, print beside its sheet, a short community explains itself. */
.settings-row-note{display:block;margin-top:2px;font-size:12px;line-height:1.35;color:#65715b}
.settings-side{display:flex;flex-direction:column;gap:inherit}
/* Side-column rows: the label above, the choice below at full width — a segmented switch never squeezes the label. */
.settings-row-stack{flex-direction:column;align-items:stretch;gap:10px;padding:4px 0 14px}
.settings-row-stack .lang-switch button{flex:1}
.settings-row>.settings-link:last-child{margin-right:-8px}
.community-howto{display:flex;flex-direction:column;gap:12px;padding:16px 18px;border-radius:18px;border:1.5px dashed #c9d4bd;background:#fffef9b3}
.community-howto>b{font-size:15px}
.community-howto ol{margin:0;padding:0;list-style:none;display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px}
.community-howto li{display:flex;gap:10px;align-items:flex-start}
.community-howto li>span{width:28px;height:28px;flex:none;border-radius:50%;display:grid;place-items:center;background:#e3eedb;color:var(--green);font-weight:800;font-size:13px}
.community-howto li b{display:block;font-size:13px}
.community-howto li small{font-size:12px;line-height:1.4;color:#5f6b57}
.community-howto .button{align-self:flex-start;border-radius:999px}
@media(min-width:1100px){
  .settings-inner{max-width:1000px;display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:16px 32px;align-items:start}
  .settings-inner>*{grid-column:1}
  .settings-inner>.print-head{grid-column:1/-1}
  .settings-inner>.settings-side{grid-column:2;grid-row:2/span 8}
  .print-inner{max-width:1040px;display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:14px 32px;align-items:start}
  .print-inner>*{grid-column:2}
  .print-inner>.print-head{grid-column:1/-1}
  .print-inner>.print-preview{grid-column:1;grid-row:2/span 9}
}
/* Publishing in three steps and which boards can go (docs/roadmap/mockups/e5-community-2, item 4) */
.publish-steps{margin:0;padding:0;list-style:none;display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.publish-steps li{display:flex;align-items:center;gap:8px;padding-top:8px;border-top:3px solid #e4e9da;font-size:13px;font-weight:650;color:#65715b}
.publish-steps li b{width:22px;height:22px;flex:none;border-radius:50%;display:grid;place-items:center;background:#eceee6;font-size:11px}
.publish-steps li.current{border-color:var(--green);color:var(--green)}.publish-steps li.current b{background:var(--green);color:#fff}
.publish-steps li.done{border-color:#9fbf8f;color:#30453b}.publish-steps li.done b{background:#c9dcbf;color:#245640}
.publish-steps li.bad{border-color:#d9a093;color:#b4493c}.publish-steps li.bad b{background:#f6e3dc;color:#b4493c}
.publish-source-tag{display:block;margin-top:3px;font-style:normal;font-size:12px;font-weight:650;color:#65715b}
.publish-source-tag[data-status=unique]{color:var(--green)}
.publish-source-tag[data-status=multiple],.publish-source-tag[data-status=unsatisfiable]{color:#a8641a}
.publish-source-list button.unfit{opacity:.6}
/* The line hint block by block, on the board (e2-hints-3): the block at its first place is a blue bar along
   the top of the cells, at its last place (a moment later) an orange bar along the bottom, its number on both.
   Cells with both bars are covered wherever the block lies — they get a green frame; other stripes wait for «Итог». */
.board.hp-stepping td.cell.hp-left,.board.hp-stepping td.cell.hp-right{box-shadow:none;position:relative}
.board.hp-stepping td.cell.hp-left:before,.board.hp-stepping td.cell.hp-right:after{content:'';position:absolute;left:0;right:0;height:38%;pointer-events:none;z-index:1}
.board.hp-stepping td.cell.hp-left:before{top:6%;background:#5b7fa3;animation:hp-bar-left .45s ease-out both}
.board.hp-stepping td.cell.hp-right:after{bottom:6%;background:#c98a2e;animation:hp-bar-right .45s .6s ease-out both}
@keyframes hp-bar-left{from{opacity:0;transform:translateX(-30%)}}
@keyframes hp-bar-right{from{opacity:0;transform:translateX(30%)}}
.board.hp-stepping td.cell[data-hp].hp-left:before{content:attr(data-hp);color:#fff;font-size:max(8px,calc(var(--cell)*.3));font-weight:800;line-height:1;display:flex;align-items:center;padding-left:3px}
.board.hp-stepping td.cell[data-hp].hp-right:after{content:attr(data-hp);color:#fff;font-size:max(8px,calc(var(--cell)*.3));font-weight:800;line-height:1;display:flex;align-items:center;padding-left:3px}
.board.hp-stepping td.cell.hp-left.hp-right[data-hp]:before{content:''}
.board.hp-stepping td.cell button.suggest-fill:not(.filled),.board.hp-stepping td.cell button.suggest-cross:not(.filled){background:none}
.board.hp-stepping td.cell button.suggest-cross:before,.board.hp-stepping td.cell button.suggest-cross:after{display:none}
.board.hp-stepping td.cell.hp-overlap button.suggest-fill:not(.filled){position:relative;z-index:2;box-shadow:inset 0 0 0 2px #295c47;animation:hp-overlap-in .4s 1.1s both}
@keyframes hp-overlap-in{from{box-shadow:none}}
/* The same in the card's strip: the first place on top, the last one under it. */
.hint-bar.half{height:12px;font-size:9px;border-radius:3px;opacity:1}
.hint-bar.half.left{top:2px}
.hint-bar.half.right{top:16px;animation-delay:.6s;animation-fill-mode:both}
/* The language of the app: in the settings and under the sign-in form. */
.lang-switch{display:flex;gap:2px;background:#f3f5ec;border-radius:9px;padding:3px;flex-shrink:0}
.lang-switch button{min-height:34px;padding:6px 10px;border-radius:6px;font-size:13px;color:#5f6b57}
.lang-switch button[aria-pressed="true"]{background:#fff;color:var(--green);font-weight:600;box-shadow:0 1px 4px #394d3014}
.login-lang{align-self:center;margin-top:14px}
@media(max-width:760px){.login-lang{margin-bottom:76px}}
/* The clue editor: the cells the numbers take, gaps, and what does not fit (e8-audit, item 6). */
.clue-meter{display:grid;gap:2px;margin:8px 0 2px}
.clue-meter:empty{display:none}
.clue-meter i{height:8px;border-radius:2px;background:#e4e9da}
.clue-meter i.fill{background:var(--green)}
.clue-meter i.unknown{background:repeating-linear-gradient(45deg,#94a682 0 2px,#e4e9da 2px 4px)}
.clue-meter i.over{background:#b4493c}
#clue-input.invalid{border-color:#b4493c;background:#fdf6f4}
.clue-editor .primary:disabled{opacity:.4;cursor:not-allowed}
#clue-error{color:#b4493c;font-weight:600}
.coach-meter{display:block;height:6px;border-radius:3px;background:#e4e9da;margin:2px 0 8px;overflow:hidden}.coach-meter[hidden]{display:none}.coach-meter i{display:block;height:100%;width:var(--done,0%);background:var(--green);border-radius:3px;transition:width .3s}
/* While numbers are still typed in, only the tools that work then (e8-audit). */
.puzzle.entering #solve,.puzzle.entering #hint,.puzzle.entering #errors,.puzzle.entering .solution-card{display:none}
/* A guest: no search or filters yet, the most liked puzzles as a teaser (e8-audit). */
.community.guest .community-search,.community.guest #community-sorts,.community.guest #community-big{display:none}
.community-card.teaser .community-board{filter:saturate(.6);opacity:.8}
.publish-source-lead{margin:0 0 12px;font-size:13px;line-height:1.5;color:#46594d}.publish-source-lead[hidden],.publish-source-signin[hidden]{display:none}.publish-source-signin{display:flex;width:100%;justify-content:center;margin-bottom:12px}
.today-pack.locked{background:#eceee6;color:#5f6b57}.today-pack.locked strong{display:flex;align-items:center;gap:6px;color:#30453b}.today-pack.locked strong svg{width:14px;height:14px;flex:none}.today-pack.locked small{line-height:1.35}
/* A laptop: the tiles on the left, the surprise picture as a column on the right (e8-audit). */
@media(min-width:1100px){
  .pack-body{display:grid;grid-template-columns:minmax(0,1fr) 280px;gap:24px;align-items:start;max-width:1040px;margin:0 auto;box-sizing:content-box}
  .pack-surprise{margin-top:0;flex-direction:column;align-items:stretch;text-align:center;gap:14px;padding:20px}
  .pack-fragments,.pack-cover{width:180px;margin:0 auto}
}
/* The example week a guest sees in «Лига недели» (e8-audit). */
.league-sample{display:flex;flex-direction:column;gap:4px;margin:0 0 14px;padding:12px;border-radius:14px;background:#f4f5ec;filter:blur(.6px);opacity:.75;user-select:none}
.league-sample-label{font-size:10px;letter-spacing:1.6px;text-transform:uppercase;font-weight:700;color:#5a7151;margin-bottom:4px;filter:none}
.league-sample-row{display:grid;grid-template-columns:28px 1fr auto;gap:8px;align-items:center;padding:6px 10px;border-radius:10px;background:#fffef9;font-size:13px}
.league-sample-row b{color:#65715b;font-weight:650}.league-sample-row em{font-style:normal;font-weight:650;color:#30453b}
.league-sample-row.up{box-shadow:inset 3px 0 0 #6aa36f}.league-sample-row.down{box-shadow:inset 3px 0 0 #d08a7e}
/* Filters are one row everywhere: it scrolls on a phone and fades at the edge (e8-audit). */
@media(max-width:1099px){
  .community-chips{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin:0 -16px;padding:0 16px}
  .community-chips::-webkit-scrollbar{display:none}
  .community-chips button{flex:none}
  .community-chips,.sets-themes{-webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 28px),transparent);mask-image:linear-gradient(90deg,#000 calc(100% - 28px),transparent)}
}
/* Every tap target at least 40 px on a phone (AGENTS.md, e8-audit). */
.pack-print{min-height:40px;display:inline-flex;align-items:center;padding:0 16px}
.login-tabs button{min-height:40px}
.lang-switch button{min-height:40px}
.daily-note a.daily-signin{display:flex;width:max-content;min-height:40px;align-items:center;margin:10px auto 0;padding:0 18px}
@media(max-width:760px){.nav-chip{min-height:40px;box-sizing:border-box;padding:0 12px}}
.streak-inner{position:relative}.streak-back{position:absolute;left:0;top:0}
.league-empty .league-sample{align-self:stretch;width:100%;box-sizing:border-box}
@media(max-width:760px){.button,#login-forgot,#login-skip,#library-scans,#library-own,#streak-sets{min-height:40px;box-sizing:border-box}}
/* The language in quick reach (docs/roadmap/mockups/e9-lang): a chip in the header for a guest, the account menu once signed in. */
.nav-lang{background:#eef2e4;color:var(--green);cursor:pointer}
.nav-lang[hidden]{display:none}
.nav-lang svg{width:15px;height:15px;flex:none}
.lang-menu{width:230px}
.lang-menu .lang-menu-item{display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:40px}
.lang-menu .lang-menu-item small{color:#65715b;font-size:12px;font-weight:400}
.lang-menu .lang-menu-item[aria-checked=true]{background:#eef2e4;color:var(--green);font-weight:650}
.lang-menu .lang-menu-item[aria-checked=true] span:after{content:' ✓'}
.lang-menu-note{margin:0;padding:6px 12px 8px;font-size:12px;line-height:1.4;color:#65715b}
.user-menu-lang{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:6px 6px 6px 12px;font-size:14px;color:#30453b}
.user-menu .user-menu-lang .lang-switch button{width:auto;display:inline-flex;align-items:center;padding:6px 9px;font-size:12px}
.nav-lang{margin-left:auto}.nav-lang:not([hidden])~#nav-streak{margin-left:0}

/* T05 — серия за одно поле, цель дня, вехи и возврат серии (docs/roadmap/mockups/e12-habit, 2.1–2.4) */
.today-goal{position:relative;display:flex;flex-direction:column;align-items:stretch;gap:14px;padding:16px 18px;border-radius:18px;background:#fffef9f2}
.today-goal[hidden],.today-revive[hidden],.today-goal [hidden]{display:none!important}
.today-goal-head{display:flex;align-items:center;gap:14px;color:inherit;text-decoration:none}
.today-goal-head:after{content:'';position:absolute;inset:0;border-radius:inherit}
.today-goal-head:focus-visible{outline:none}.today-goal:has(.today-goal-head:focus-visible){outline:2px solid var(--green);outline-offset:2px}
.today-goal-flame{flex:none;width:44px;height:44px;display:grid;place-items:center}
.today-goal-flame svg{width:40px;height:40px;fill:#d08a2e}
.today-goal.cold .today-goal-flame svg{fill:#d9dccf}
.today-goal .today-goal-text{gap:3px}
.today-goal .today-goal-text strong{font-size:17px;font-weight:700;letter-spacing:-.2px}
.today-goal .today-goal-text small{margin:0;font-size:13px;line-height:1.35}
.today-goal .goal-week{max-width:none;padding:0 2px}
.today-goal-foot{display:flex;align-items:center;justify-content:space-between;gap:12px;padding-top:12px;border-top:1px solid #ebeee3;font-size:12px;color:#5f6b57}
.today-goal-freezes{display:inline-flex;align-items:center;gap:5px;color:#4d7ea8;font-weight:600}
.today-goal-freezes svg{width:14px;height:14px}
.today-goal-actions{position:relative;z-index:1;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.today-goal-actions .button,.today-revive .button{min-height:44px;margin:0;padding:10px 16px;border-radius:999px;font-size:14px;font-weight:650;justify-content:center;white-space:normal;line-height:1.2;text-align:center}
.today-revive{display:flex;flex-direction:column;gap:8px;padding:16px 18px;border-radius:18px;background:#fffaf1;border:1px solid #f0e2c9;color:#3d2f20}
.today-revive-eyebrow{font-size:10px;font-weight:700;letter-spacing:1.6px;text-transform:uppercase;color:#b87523}
.today-revive strong{font-size:18px;font-weight:700;line-height:1.25;letter-spacing:-.2px}
.today-revive small{font-size:13px;line-height:1.45;color:#7a6650}
.today-revive-progress{display:flex;align-items:center;gap:12px;margin-top:4px}
.today-revive-bar{flex:1;height:8px;border-radius:999px;background:#f1e6d3;overflow:hidden}
.today-revive-bar i{display:block;height:100%;width:0;border-radius:inherit;background:#d08a2e;transition:width .4s ease}
.today-revive-progress b{font-size:14px;font-variant-numeric:tabular-nums}
.today-revive .today-revive-left{font-size:12px;color:#9a8466;margin-bottom:4px}
.today-revive-daily{align-self:center;min-height:40px;padding:8px 12px;font-size:13px;font-weight:600;color:var(--green);text-align:center}
.goal-day.met.revived i{background:#fbefdc;box-shadow:inset 0 0 0 2px #e9c88f}
.streak{position:relative}
.streak-inner{position:relative;z-index:1}
.streak-art{width:var(--flame,140px)}
.streak-confetti{position:absolute;inset:0;pointer-events:none;overflow:hidden}
.streak-confetti i{position:absolute;top:-20px;width:9px;height:9px;border-radius:2px;opacity:0}
.streak-confetti.run i{animation:confetti 2.4s ease-in forwards;animation-delay:var(--d)}
.streak.party{background:radial-gradient(circle at 50% 28%,#fff7e6,#f3e9d9 72%)}
.streak.party .streak-flame{display:flex;flex-direction:column;align-items:center;gap:6px}
.streak.party .streak-flame b{position:static;transform:none;padding:0;background:none;box-shadow:none;font-family:Georgia,"Times New Roman",serif;font-weight:400;font-size:64px;line-height:1;color:#c07a22}
.streak.party .streak-head{padding-top:0;margin-top:-12px}
.streak.party .streak-head p:empty{display:none}
.streak-milestone{width:100%;display:flex;flex-direction:column;gap:4px;padding:14px 16px;border-radius:16px;background:#fff;border:1px solid #f0e2c9;text-align:left}
.streak-milestone b{font-size:15px;font-weight:650}
.streak-milestone small{font-size:12px;line-height:1.4;color:#7a6650}
.streak-track{width:100%;display:flex;justify-content:space-between;align-items:center;gap:4px}
.streak-track span{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;font-size:12px;font-weight:650;color:#a99a84;background:#f3ece0;font-variant-numeric:tabular-nums}
.streak-track span.got{color:#a8641a;background:#fbefdc}
.streak-track span.now{color:#a8641a;background:#fff;box-shadow:inset 0 0 0 2px #d08a2e;font-weight:800}
#streak-share{background:none}
.settings-row input.settings-time{width:100%;height:auto;min-height:44px;padding:8px 12px;border:1px solid #d9dfcf;border-radius:10px;background:#fffef9;color:#30453b;font-size:15px}
@media(max-width:760px){
  .today-goal,.today-revive{padding:14px}
  .today-goal-head{gap:12px}
}
/* T01 — начатые поля (docs/roadmap/mockups/e11-play-tools, 1.1–1.2) */
/* Phone: «✓ сохранено» takes the place of the meta line for a second (no room beside it); laptop: after it. */
.play-meta-line{position:relative;display:block;min-width:0;white-space:nowrap}
.play-meta-line #play-meta{display:block;overflow:hidden;text-overflow:ellipsis;transition:opacity .2s}
.play-title .play-saved{position:absolute;left:0;top:0;color:#6f8a60;font-weight:600;opacity:0;transition:opacity .2s;pointer-events:none}
.play-meta-line.saved #play-meta{opacity:0}
.play-meta-line.saved .play-saved{opacity:1}
@media(min-width:1100px){
  .puzzle.playing .play-meta-line{display:flex;align-items:baseline}
  .puzzle.playing .play-meta-line.saved #play-meta{opacity:1}
  .puzzle.playing .play-title .play-saved{position:static;font-size:13px;font-weight:400;color:#5a7151}
  .puzzle.playing .play-saved:before{content:'\00a0·\00a0';color:#65715b}
}
/* T07 — friends (docs/roadmap/mockups/e12-habit, 2.8): the screen from the profile and «Все · Друзья» of the daily ranking */
.friends-inner{max-width:560px}
.friends-main{display:flex;flex-direction:column;gap:14px}
.friends-side{display:flex;flex-direction:column;gap:inherit}
.friends-card{padding:14px;border-radius:16px;background:#fffef9f2;border:1px solid #e1e5d7}
.friends-invite{display:flex;align-items:center;gap:12px}
.friends-invite-text{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.friends-invite-text b,.friends-quest>b{font-size:15px;font-weight:650}
.friends-invite-text small,.friends-quest>small{font-size:12px;line-height:1.4;color:#65715b}
.friends-invite .button,.friends-add-row .button,.friends-guest .button,.friends-claim{min-height:44px;font-size:14px;padding:0 18px;border-radius:12px;flex:none}
.friends-quest{display:flex;flex-direction:column;gap:6px}
.friends-brow{font-size:10px;font-weight:700;letter-spacing:1.6px;text-transform:uppercase;color:#65715b}
.friends-bar{height:8px;border-radius:4px;background:#e7ebdd;overflow:hidden;margin:2px 0}
.friends-bar i{display:block;height:8px;border-radius:4px;background:var(--green);transition:width .5s ease-out}
.friends-claim{align-self:flex-start;margin-top:4px}
.friends-list{list-style:none;margin:0;padding:2px 14px;display:flex;flex-direction:column}
.friend-row{display:flex;align-items:center;flex-wrap:wrap;gap:0 10px;min-height:60px}
.friend-row+.friend-row{border-top:1px solid #ebeee3}
.friend-main{flex:1;min-width:0;display:flex;align-items:center;gap:12px;padding:10px 0;text-align:left;border-radius:10px}
.friend-avatar{flex:none;width:36px;height:36px;border-radius:12px;display:grid;place-items:center;font-style:normal;font-size:15px;font-weight:700;color:#fff}
.friend-text{min-width:0;display:flex;flex-direction:column;gap:2px}
.friend-text b{font-size:14px;font-weight:650;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.friend-text small{font-size:12px;line-height:1.35;color:#65715b}
.friend-text small span{white-space:nowrap}
.friend-nudge{min-height:40px;padding:0 10px;margin-right:-10px;font-size:13px;font-weight:650;color:var(--green)}
.friend-nudged{font-size:12px;color:#65715b}
.friend-streak{font-size:12px}
.friend-streak.cold{background:#eef0e7;color:#65715b}
.friend-actions{flex:1 0 100%;display:flex;flex-direction:column;align-items:flex-start;gap:4px;padding:0 0 12px 48px}
.friend-actions small{font-size:12px;line-height:1.4;color:#5f6b57}
.friend-remove{min-height:40px;padding:0 10px;margin-left:-10px;font-size:13px;font-weight:600;color:#a1483c}
.friend-remove.confirm{background:#f5e1dc;color:#6e2c22}
.friends-empty{display:flex;flex-direction:column;gap:4px;padding:14px 0;text-align:center}
.friends-empty b{font-size:14px;font-weight:650}
.friends-empty small{font-size:12px;line-height:1.45;color:#65715b}
.friends-add-row{display:flex;gap:8px;padding:2px 0 12px}
.friends-add-row input{flex:1;min-width:0;height:44px;padding:0 12px;border-radius:12px;border:1px solid #d7ddcf;background:#fff;font-size:16px;color:#30453b;letter-spacing:.5px}
.friends-add-row input[aria-invalid]{border-color:#c98b80;background:#fdf6f4}
.friends-error{margin:0 0 12px;padding:10px 12px;border-radius:12px;background:#f5e1dc;font-size:13px;line-height:1.4;color:#6e2c22}
.friends-name-row{border-top:1px solid #ebeee3}
.friends-name-row strong{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.friends-name-row .settings-link,#settings .settings-link{min-height:40px}
.friends-name-form{border-top:1px solid #ebeee3;padding-top:12px}
.friends-privacy{margin-top:4px;font-size:12px;color:#65715b}
.friends-guest{display:flex;flex-direction:column;align-items:flex-start;gap:8px;padding:18px}
.friends-guest-icon{width:48px;height:48px;border-radius:14px;background:#e3eedb;color:var(--green);display:grid;place-items:center}
.friends-guest-icon svg{width:26px;height:26px}
.friends-guest b{font-size:16px;font-weight:650}
.friends-guest p{margin:0 0 6px;font-size:13px;line-height:1.5;color:#5f6b57}
.account-friends{display:flex;align-items:center;gap:12px;padding:12px 14px;min-height:60px;border-radius:16px;background:#fffef9f2;border:1px solid #e1e5d7}
.account-friends-icon{flex:none;width:36px;height:36px;border-radius:12px;background:#e3eedb;color:var(--green);display:grid;place-items:center}
.account-friends-icon svg{width:20px;height:20px}
.account-friends-text{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.account-friends-text b{font-size:14px;font-weight:650}
.account-friends-text small{font-size:12px;color:#65715b}
.account-friends-go{flex:none;width:18px;height:18px;color:#a0aa95}
.daily-friends-tabs{align-self:flex-start}
.daily-friends-tabs button{padding:6px 14px}
.daily-row span small{display:block;font-size:12px;font-weight:400;color:#65715b}
@media(min-width:1100px){
  .friends-inner{max-width:1000px}
  .friends-main{display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:14px 32px;align-items:start}
  .friends-main>*{grid-column:1}
  .friends-main>.friends-side{grid-column:2;grid-row:1/span 3}
  .friends-guest{max-width:560px}
}
.today-started{display:flex;flex-direction:column;gap:12px;min-width:0}
.today-started[hidden]{display:none}
.today-started-head{display:none;font-size:11px;font-weight:650;letter-spacing:1.8px;color:#5a7151}
.today-started-list{display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;margin:0 -16px;padding:0 16px;scroll-padding:0 16px}
.today-started-list::-webkit-scrollbar{display:none}
.today-started-item{cursor:pointer;min-width:0}
.today-started-item:not(.first){flex:0 0 calc(50% - 6px);box-sizing:border-box;scroll-snap-align:start;align-items:flex-start}
.today-started-thumb{flex:none;width:48px;height:48px;box-sizing:border-box;padding:5px;border-radius:12px;background:#fff;border:1px solid #e1e5d7;display:grid;place-items:center}
.today-started-thumb .pixel-grid{width:100%;max-height:100%}
.today-started-text{flex:1;min-width:0;display:flex;flex-direction:column}
.today-started-text strong{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.today-started-eyebrow{font-size:11px;font-weight:650;letter-spacing:1.4px;text-transform:uppercase;color:#5a7151;margin-bottom:2px}
.today-started-item:not(.first) .today-started-eyebrow{font-size:12px;font-weight:500;letter-spacing:0;text-transform:none;color:#65715b}
.today-started-item .today-continue-bar{margin-top:8px}
.today-started-go{flex:none;width:44px;height:44px;border-radius:50%;background:linear-gradient(135deg,#367457 0%,#245640 100%);color:#fff;display:grid;place-items:center;box-shadow:0 6px 14px #295c4733}
.today-started-go svg{width:20px;height:20px;margin-left:2px}
.today-started-pill{flex:none;display:none;align-items:center;height:40px;padding:0 16px;border-radius:999px;background:#eef2e4;color:var(--green);font-size:13px;font-weight:700}
.today-started-item :is(.today-started-short,.today-started-side){display:none}
.today-started-item:not(.first) :is(.today-started-thumb,.today-started-go,.today-started-full,.today-continue-bar){display:none}
.today-started-item:not(.first) .today-started-short{display:block}
@media(max-width:760px){.today-started{order:-1}}
@media(min-width:761px){
  .today-started{gap:10px}
  .today-started-head{display:block}
  .today-started-list{flex-direction:column;gap:10px;overflow:visible;margin:0;padding:0}
  .today-started-list .today-started-item:nth-child(n+3){display:none}
  .today-started-item,.today-started-item:not(.first){flex:none;align-items:center;padding:12px 14px}
  .today-started .today-started-item .today-started-thumb{display:grid}
  .today-started .today-started-item :is(.today-started-eyebrow,.today-started-full,.today-started-short,.today-continue-bar,.today-started-go){display:none}
  .today-started-item .today-started-side{display:block}
  .today-started-pill{display:inline-flex}
}
.pack-tile-started{font-size:12px;font-weight:650;color:var(--green);white-space:nowrap}
.pack-tile-bar{width:58%;height:4px;border-radius:2px;background:#e7ebdd;overflow:hidden}
.pack-tile-bar i{display:block;height:100%;border-radius:2px;background:var(--green)}
.streak.party .streak-inner{min-height:100%;justify-content:center}
@media(max-height:700px){
  .streak.party .streak-art{width:calc(var(--flame,140px) - 36px)}
  .streak.party .streak-flame b{font-size:54px}
}
@media(min-width:761px){
  .today-goal{flex-direction:row;flex-wrap:wrap;align-items:center;column-gap:28px;row-gap:14px;padding:18px 22px}
  .today-goal-head{flex:1 1 340px;min-width:0}
  .today-goal-actions{flex:0 0 auto;grid-template-columns:repeat(2,minmax(176px,auto))}
  .today-goal .goal-week{flex:0 1 400px;max-width:400px}
  .today-goal-foot{flex:1 1 100%}
}

/* T04 — автор и лицензия картинок по чужим работам (docs/roadmap/mockups/e14-credits) */
.play-credit{flex:none;width:40px;height:40px;margin:0 -6px;display:grid;place-items:center;border-radius:50%;color:#4f5f47;background:radial-gradient(circle,#eef1e6 0 15px,transparent 15.5px)}
@media(min-width:1100px){.puzzle.playing .play-credit{margin:0}}
.play-credit[hidden]{display:none}
.play-credit svg{width:18px;height:18px}
@media(min-width:1100px){.puzzle.playing .play-credit{order:3}}
.credit-sheet h2{margin:0;font-family:Georgia,"Times New Roman",serif;font-weight:400;font-size:24px;color:#253d33}
.credit-sheet p{margin:0;font-size:14px;line-height:1.5;color:#5f6b57}
.credit-sheet #credit-sheet-line:empty{display:none}
.credit-sheet-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.credit-sheet-actions .button{min-height:44px;border-radius:999px;font-size:14px;font-weight:650}
.credit-sheet-actions .button[hidden]{display:none}
.credit-sheet-actions:has(.button[hidden]){grid-template-columns:1fr}
.credit-line{width:100%;min-width:0;text-align:left;color:#5f6b57}
.credit-summary{width:100%;min-height:40px;display:flex;align-items:center;gap:6px;padding:4px 2px;font-size:10.5px;line-height:1.3;color:inherit;text-align:left}
.credit-summary>svg:first-child{flex:none;width:14px;height:14px}
.credit-name{flex:1;min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.credit-license{flex:none;font-weight:700;color:#4f5f47;white-space:nowrap}
.credit-chevron{flex:none;width:12px;height:12px;transition:transform .2s ease}
.credit-line.open .credit-chevron,.credits-row.open .credit-chevron{transform:rotate(90deg)}
.credit-more{margin-top:4px;padding:10px 12px;border-radius:12px;background:#fffef9;border:1px solid #e1e5d7;display:flex;flex-direction:column;gap:4px;font-size:12px;line-height:1.45;color:#5f6b57}
.credit-more[hidden]{display:none}
.credit-more p{margin:0}
.credit-more p:first-child{color:#30453b;font-weight:600}
.credit-more a{color:var(--green);font-weight:650;white-space:nowrap}
.done-credit{width:100%;max-width:300px;margin:-12px 0 -10px}
.done-credit[hidden]{display:none}
.pack-credits{align-self:flex-start;max-width:100%;min-height:40px;display:inline-flex;align-items:center;gap:7px;padding:0 2px;font-size:13px;color:inherit;opacity:.85}
.pack-credits>svg:first-child{flex:none;width:16px;height:16px}
.pack-credits span{white-space:nowrap}
.pack-credits b{font-size:10px;font-weight:700;letter-spacing:1px;text-transform:uppercase;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.credits-inner{max-width:560px}
.credits-note{margin:0;font-size:14px;line-height:1.5;color:#5f6b57}
.credits-list{display:flex;flex-direction:column;border-radius:16px;background:#fffef9f2;border:1px solid #e1e5d7;padding:4px 14px}
.credits-list:empty{display:none}
.credits-row{display:flex;align-items:flex-start;gap:12px;padding:12px 0}
.credits-row+.credits-row{border-top:1px solid #ebeee3}
.credits-thumb{flex:none;width:40px;height:40px;border-radius:8px;background:#eceee6;display:grid;place-items:center;font-size:13px;font-weight:650;color:#a3ad98;overflow:hidden}
.credits-thumb .pixel-grid{width:100%}
.credits-body{flex:1;min-width:0;display:flex;flex-direction:column}
.credits-head{width:100%;min-height:40px;display:flex;align-items:center;gap:8px;color:inherit;text-align:left}
.credits-text{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.credits-text strong{font-size:14px;font-weight:650;color:#30453b}
.credits-text small{font-size:12px;color:#5f6b57}
.credits-head .credit-chevron{width:16px;height:16px;color:#65715b}
.credits-closed{align-self:center;font-size:13px;color:#65715b}
.credits-all{align-self:center;min-height:40px;padding:8px 14px;font-size:14px;font-weight:600;color:var(--green)}
.credits-all[hidden]{display:none}
.print-credit{font-size:2.8mm!important;margin-top:.6mm!important}
/* On a short phone the credited «Готово» keeps «Дальше» and «Поделиться» on screen: a smaller picture, tighter gaps */
@media(max-height:700px){
  .done-inner:has(#done-credit:not([hidden])){gap:11px}
  .done-inner:has(#done-credit:not([hidden])) .done-picture{padding:12px}
  .done-inner:has(#done-credit:not([hidden])) .done-picture .pixel-grid{width:150px}
  .done-inner:has(#done-credit:not([hidden])) .done-original{width:150px;height:150px}
  .done-inner:has(#done-credit:not([hidden])) .done-credit{margin:-8px 0 -6px}
}
/* T09 — тёмная тема: блок создан scripts/dark_theme.py, правится там */
@media screen{
:root[data-theme=dark]{color:#d3e3da;background:#181f1a}
html[data-theme=dark] button{color:inherit}
html[data-theme=dark] a{color:inherit;text-decoration:none}
html[data-theme=dark] button:focus-visible,html[data-theme=dark] a:focus-visible,html[data-theme=dark] input:focus-visible{outline:3px solid #738a61}
html[data-theme=dark] button{background:none}
html[data-theme=dark] .topbar{border-bottom:1px solid #373e3a;background:#1a211c}
html[data-theme=dark] .brand-dot{color:#a5ac9f}
html[data-theme=dark] .brand-mark i{background:var(--green)}
html[data-theme=dark] .header-separator{background:var(--line)}
html[data-theme=dark] .puzzle-label{color:#a8ada2}
html[data-theme=dark] .primary{background:var(--green);color:#10251b}
html[data-theme=dark] .upload{border:1px solid #38443c;background:#1e2520}
html[data-theme=dark] .secondary{border:1px solid #37433b;background:#1c231f}
html[data-theme=dark] .quiet{color:#b5bdb0}
html[data-theme=dark] .quiet:hover{background:#2e3430}
html[data-theme=dark] .eyebrow{color:#a8aea0}
html[data-theme=dark] .welcome p{color:#abb0a3}
html[data-theme=dark] .file-help{color:#a2a699}
html[data-theme=dark] .examples>span{color:#a4a99c}
html[data-theme=dark] .examples button{color:#b6beb1;border-bottom:1px solid #3d4236}
html[data-theme=dark] .welcome-art{border:1px solid #3d4035;background:#2d3430;box-shadow:9px 10px 0 #00000099}
html[data-theme=dark] .welcome-art span{border:1px solid #3e4236}
html[data-theme=dark] .welcome-art span:nth-child(3),html[data-theme=dark] .welcome-art span:nth-child(7),html[data-theme=dark] .welcome-art span:nth-child(8),html[data-theme=dark] .welcome-art span:nth-child(9),html[data-theme=dark] .welcome-art span:nth-child(n+11):nth-child(-n+15),html[data-theme=dark] .welcome-art span:nth-child(17),html[data-theme=dark] .welcome-art span:nth-child(19),html[data-theme=dark] .welcome-art span:nth-child(22),html[data-theme=dark] .welcome-art span:nth-child(24){background:#6f8d61;border-color:#83a275}
html[data-theme=dark] .board-meta{color:#a7ac9e}
html[data-theme=dark] .review-status{color:#d2ab67}
html[data-theme=dark] .review-status.ready{color:#adb5a8}
html[data-theme=dark] .board-meta #my-board{color:var(--green)}
html[data-theme=dark] .board th{color:#c2c9bc}
html[data-theme=dark] .corner-decoration{color:#a2a79a}
html[data-theme=dark] .clue-button{color:inherit}
html[data-theme=dark] .clue-button:hover{background:#2d3830}
html[data-theme=dark] .clue-button.uncertain{color:#dfb16b;background:#3a3325}
html[data-theme=dark] .clue-button.reviewed:after{background:#7f9a6d}
html[data-theme=dark] .board .cell{border:1px solid #40453a;background:#1e2521}
html[data-theme=dark] .board .cell.major-right{border-right:2px solid #859376}
html[data-theme=dark] .board tr.major-bottom .cell{border-bottom:2px solid #859376}
html[data-theme=dark] .board tr:nth-child(2) .cell{border-top:2px solid #859376}
html[data-theme=dark] .board .cell:first-of-type{border-left:2px solid #859376}
html[data-theme=dark] .cell button{color:#989d90}
html[data-theme=dark] .cell button:hover:enabled{background:#2d3730}
html[data-theme=dark] .cell button.filled{background:#345f49}
html[data-theme=dark] .cell button.filled:hover:enabled{background:#345f49}
html[data-theme=dark] .cell button.empty{background:#161c18}
html[data-theme=dark] .cell button.empty:before,html[data-theme=dark] .cell button.empty:after{background:currentColor}
html[data-theme=dark] .cell button.hinted{box-shadow:inset 0 0 0 3px #d3ad54}
html[data-theme=dark] .action-dock{background:#1e2521;border:1px solid #354039;box-shadow:0 10px 35px #00000020}
html[data-theme=dark] .paint-tools{background:#171e1a}
html[data-theme=dark] .paint-tools button{color:#adb3a6}
html[data-theme=dark] .paint-tools .active{background:#1f2621;color:var(--green);box-shadow:0 1px 4px #00000024}
html[data-theme=dark] .paint-square{background:currentColor}
html[data-theme=dark] .dock-divider{background:#303632}
html[data-theme=dark] .dock-quiet{color:#afb6a9}
html[data-theme=dark] .dock-hint{color:#bcc5b8}
html[data-theme=dark] .solve-status{background:#2c352f;border:1px solid #3b4035;color:#bbc3b6;box-shadow:0 4px 20px #0000000e}
html[data-theme=dark] .solve-status.error{color:#deb379;background:#161c18;border-color:#443f34}
html[data-theme=dark] .source-panel{background:#1e2521;border:1px solid #364039;box-shadow:0 15px 65px #00000044}
html[data-theme=dark] .icon-button{background:#161c18;color:#b3baad}
html[data-theme=dark] .muted{color:#a9afa2}
html[data-theme=dark] .helper{color:#a7ad9f}
html[data-theme=dark] details{border-top:1px solid #353f38}
html[data-theme=dark] summary{color:#b8bfb2}
html[data-theme=dark] .check-label input{accent-color:var(--green)}
html[data-theme=dark] .size-form label{color:#a9afa2}
html[data-theme=dark] .size-form input{border:1px solid #37423b;background:#1e2520;color:var(--green)}
html[data-theme=dark] dialog{border:1px solid #354139;box-shadow:0 30px 100px #0000005c;color:#d3e3da;background:#1e2521}
html[data-theme=dark] dialog::backdrop{background:#35463355}
html[data-theme=dark] .clue-crop-wrap{background:#151c17}
html[data-theme=dark] .clue-input-label{color:#adb4a7}
html[data-theme=dark] #clue-input{border:1px solid #3f4438;color:var(--green);background:#1e2521}
html[data-theme=dark] .form-error{color:#e8aa74}
html[data-theme=dark] .notification{border:1px solid #3c4034;box-shadow:0 5px 25px #00000024;background:#1e2520;color:#c2cabd}
html[data-theme=dark] .notification.error{color:#dfaf72;border-color:#433e33;background:#1b221d}
html[data-theme=dark] .notification.busy:before{border:2px solid #3f4439;border-top-color:var(--green)}
html[data-theme=dark] .drop-overlay{border:2px dashed #819c6e;background:#181e1af5}
html[data-theme=dark] .drop-overlay span{color:#a8afa2}
html[data-theme=dark] .guessed-number{background:#443718;color:#eab778}
html[data-theme=dark] .guessed-number sup{background:#1b221d;border:1px solid #4a453a}
html[data-theme=dark] .clue-alternatives{background:#181f1b;border:1px solid #423d32}
html[data-theme=dark] .alternative-heading{color:#d4b072}
html[data-theme=dark] .alternative-group>span{color:#b1aa9d}
html[data-theme=dark] .alternative-chip{border:1px solid #454035;background:#1e2520;color:#dab476}
html[data-theme=dark] .alternative-chip:hover,html[data-theme=dark] .alternative-chip.selected{background:#46391a;border-color:#9c803f;color:#e9ca9a}
html[data-theme=dark] .clue-button.unknown{background:#42312e;color:#ffa79b}
html[data-theme=dark] .unknown-number{color:#ffa99d;background:#4c332f}
html[data-theme=dark] .clue-button.unknown .guessed-number{color:#eab778;background:#443718}
html[data-theme=dark] .cell button.paper-mark.filled{background:repeating-linear-gradient(135deg,#91a897 0px,#91a897 3px,#3b453e 3px,#3b453e 5px)}
html[data-theme=dark] .cell button.paper-mark.empty{color:#9ca89d;background:#2f3330}
html[data-theme=dark] .paper-marks{color:#acb4a8}
html[data-theme=dark] .paper-marks .quiet{background:#2d342f}
html[data-theme=dark] .paper-marks #use-paper{border:1px solid #3c4136;color:#b0d2a3}
html[data-theme=dark] .clue-focus{border:2px solid #bb8735;background:#483a1b22;box-shadow:0 0 0 1px #48484899}
html[data-theme=dark] .suggestion-option{background:#161d18;border:1px solid #433f33}
html[data-theme=dark] .suggestion-option strong{color:#d9ba7f}
html[data-theme=dark] .suggestion-option span{color:#b8b3a5}
html[data-theme=dark] .photo-viewport{background:#2f3631}
html[data-theme=dark] .reconstruct-button{color:#a6d7b3;background:#2c362f;border:1px solid #3c4136}
html[data-theme=dark] .reconstruction-message{color:#b8c0b3}
html[data-theme=dark] .reconstruction-preview{background:#1e2520;border:1px solid #41463b}
html[data-theme=dark] .reconstruction-preview>span{background:#151c17}
html[data-theme=dark] .reconstruction-preview>span.on{background:#57785b}
html[data-theme=dark] .reconstruction-changes{border-top:1px solid #344038}
html[data-theme=dark] .reconstruction-change{border-bottom:1px solid #353e38}
html[data-theme=dark] .reconstruction-change strong{color:#b2b9ac}
html[data-theme=dark] .reconstruction-change>span{color:#d3b16e;background:#161c18}
html[data-theme=dark] .solution-card{color:#bfc7b9}
html[data-theme=dark] .solution-peek{border:1px solid #3b4034;background:#1c231e;color:#b0cda4}
html[data-theme=dark] .solution-thumbnail>span{background:#151c17}
html[data-theme=dark] .solution-thumbnail>span.on{background:#557751}
html[data-theme=dark] .dock-photo{color:#b6beb1}
html[data-theme=dark] .clue-button.uncertain{background:none;color:inherit}
html[data-theme=dark] .guessed-number{background:none;color:inherit}
html[data-theme=dark] .guessed-number sup{background:#19201c;color:#abafa1}
html[data-theme=dark] .clue-button.unknown{background:none;color:inherit}
html[data-theme=dark] .clue-button.unknown .guessed-number{background:none;color:inherit}
html[data-theme=dark] .unknown-number{color:#ffa99d;background:#41322e}
html[data-theme=dark] .review-status.ready{color:#adb5a8}
html[data-theme=dark] .guessed-number sup{background:transparent;color:#abafa1}
html[data-theme=dark] .cell button.correction-target{box-shadow:inset 0 0 0 max(1px,calc(var(--cell)*.07)) #c56d36,inset 0 0 0 max(2px,calc(var(--cell)*.14)) #6d5845}
html[data-theme=dark] .cell button.correction-target:focus-visible{outline:2px solid #d47a44}
html[data-theme=dark] .board .correction-axis .clue-button{background:#3d3125;color:#ffb084;box-shadow:inset 0 0 0 1px #e2ad7e}
html[data-theme=dark] .solution-card.complete #solution-ready{color:#a3dfbf}
html[data-theme=dark] .solution-card{border:1px solid #354039;background:#1d231f}
html[data-theme=dark] .progress-summary strong{color:#c5cfc3}
html[data-theme=dark] .progress-summary p{color:#afb4a7}
html[data-theme=dark] .progress-icon{background:#2e3430;color:#afb6a9}
html[data-theme=dark] .solution-card[data-status=complete],html[data-theme=dark] .solution-card[data-status=correct]{background:#161c18;border-color:#3a4136}
html[data-theme=dark] .solution-card[data-status=complete] .progress-icon,html[data-theme=dark] .solution-card[data-status=correct] .progress-icon{background:#30392b;color:#a1dfbc}
html[data-theme=dark] .solution-card[data-status=conflict],html[data-theme=dark] .solution-card[data-status=clues]{background:#1a201c;border-color:#453e33}
html[data-theme=dark] .solution-card[data-status=conflict] .progress-icon,html[data-theme=dark] .solution-card[data-status=clues] .progress-icon{color:#e9ab6c;background:#3d3222}
html[data-theme=dark] .check-progress{color:#b3bbae}
html[data-theme=dark] .solution-peek{background:#1e2521}
html[data-theme=dark] .action-dock{box-shadow:0 5px 22px #00000014}
html[data-theme=dark] .tool-button{color:#b2baae}
html[data-theme=dark] .dock-hint{background:#151c18}
html[data-theme=dark] .solve-status{box-shadow:none}
html[data-theme=dark] .settings-list>button{border-top:1px solid #363c38}
html[data-theme=dark] .settings-list>button>span:first-child{color:#b0b7aa}
html[data-theme=dark] .settings-list>button>span:last-child{color:#b2b9ac}
html[data-theme=dark] .settings-list small{color:#a6aea1}
html[data-theme=dark] .settings-list .danger strong{color:#e9ad9f}
@media(max-width:600px){
html[data-theme=dark] dialog.settings-dialog:before,html[data-theme=dark] dialog.clue-editor:before,html[data-theme=dark] dialog.reconstruction-review:before{background:#313a34}
}
html[data-theme=dark] .clue-placeholder{background:linear-gradient(90deg,#2f3631 0%,#19201b 50%,#2f3631 100%)}
html[data-theme=dark] .guessed-number.suspect-number{color:#ffa595}
html[data-theme=dark] .guessed-number.suspect-number sup{color:#ffa595}
html[data-theme=dark] .solve-status .button{background:#1e2520}
html[data-theme=dark] #progress-detail{color:#afb4a7}
html[data-theme=dark] .tool-button.zoomed{color:var(--green);background:#2c342f}
html[data-theme=dark] .zoom-menu:not([hidden]){background:#1e2521;border:1px solid #354039;box-shadow:0 10px 30px #00000041}
html[data-theme=dark] .zoom-menu button{color:#b7bfb2}
html[data-theme=dark] .zoom-menu button:hover{background:#2c342f}
html[data-theme=dark] .board-area .solve-status{box-shadow:0 10px 30px #00000041}
html[data-theme=dark] .welcome{background:radial-gradient(120% 90% at 50% 38%,#1b221e 0%,#161d19 55%,#2d3530 100%)}
html[data-theme=dark] .welcome-field{background-image:linear-gradient(#313a34 1px,transparent 1px),linear-gradient(90deg,#313a34 1px,transparent 1px)}
html[data-theme=dark] .welcome-field>span.on{background:#6f8d61}
html[data-theme=dark] .welcome h1{color:#d8e8e0}
html[data-theme=dark] .welcome p{color:#b3b9ac}
html[data-theme=dark] .welcome .eyebrow{color:#c0c9bc;background:#2c342e;border:1px solid #3b3f33}
html[data-theme=dark] .hero-board{background:#1e2521;border:1px solid #354039;box-shadow:0 18px 40px #0000002b,0 2px 0 #00000099}
html[data-theme=dark] .hero-clue{color:#aab1a4}
html[data-theme=dark] .hero-cell{border:1px solid #37423b;background:#1c231f}
html[data-theme=dark] .hero-cta{color:#ffffff;background:linear-gradient(135deg,#367457 0%,#245640 100%);box-shadow:0 14px 34px #00000080,inset 0 1px 0 #4848482e}
html[data-theme=dark] .hero-cta:before{border-radius:inherit;border:2px solid #749f79}
html[data-theme=dark] .hero-cta:hover:enabled{box-shadow:0 18px 40px #00000099,inset 0 1px 0 #4848482e}
html[data-theme=dark] .hero-cta-icon{background:#1f262122}
html[data-theme=dark] .hero-cta-text small{color:#d7e6d6}
html[data-theme=dark] .welcome .file-help{color:#a6ac9e}
@media(prefers-reduced-motion:reduce){
html[data-theme=dark] .hero-cell.on{background:#3f6b4f;border-color:#86b596}
}
html[data-theme=dark] .puzzle{background:radial-gradient(120% 90% at 50% 40%,#1b221e 0%,#161d19 60%,#2d352f 100%)}
html[data-theme=dark] .puzzle:before{background-image:linear-gradient(#303933 1px,transparent 1px),linear-gradient(90deg,#303933 1px,transparent 1px)}
html[data-theme=dark] .solution-card{background:#1e2521d9;border:1px solid #354039;box-shadow:0 6px 20px #00000017}
html[data-theme=dark] .solution-card[data-status=complete],html[data-theme=dark] .solution-card[data-status=correct]{background:#161d19dd;border-color:#3a4137}
html[data-theme=dark] .solution-card[data-status=conflict],html[data-theme=dark] .solution-card[data-status=clues]{background:#1a201cdd;border-color:#453e33}
html[data-theme=dark] .progress-icon{box-shadow:inset 0 0 0 1px #22222208}
html[data-theme=dark] .board-sheet{background:#1e2521;border:1px solid #354039;box-shadow:0 22px 50px #00000028,0 2px 0 #00000099}
html[data-theme=dark] .board .cell{background:#1f2621}
html[data-theme=dark] .cell button.filled,html[data-theme=dark] .cell button.filled:hover:enabled{background:#3f6b4f}
html[data-theme=dark] .cell button.empty{background:#171e1a;color:#9da396}
html[data-theme=dark] .board th{color:#c9d2c5}
html[data-theme=dark] .corner-decoration{color:#9ca193}
html[data-theme=dark] .action-dock{background:#1e2521d9;border:1px solid #354039;box-shadow:0 16px 40px #00000032,inset 0 1px 0 #484848b0}
html[data-theme=dark] .action-dock .primary{background:linear-gradient(135deg,#367457 0%,#245640 100%);box-shadow:0 8px 20px #0000005c,inset 0 1px 0 #4848482a}
html[data-theme=dark] .action-dock .primary:hover:enabled{box-shadow:0 12px 26px #00000073,inset 0 1px 0 #4848482a}
html[data-theme=dark] .action-dock .dock-hint{background:#151c17;border:1px solid #3a3f34;color:#badab4}
html[data-theme=dark] .action-dock .dock-hint:hover:enabled{background:#2c3730}
html[data-theme=dark] .paint-tools{background:#161d19}
html[data-theme=dark] .board td.cell.focus-line{background:#161c18}
html[data-theme=dark] .board td.cell.focus-line button:not(.filled){background:transparent}
html[data-theme=dark] .board th.focus-axis .clue-button{background:#31372a;color:#b3e2c3;box-shadow:inset 0 0 0 1px #4f5b44}
html[data-theme=dark] .board:has(.correction-target) td.cell.focus-line{background:#161d18}
html[data-theme=dark] .board:has(.correction-target) th.focus-axis .clue-button{background:#3d3125;color:#ffb084;box-shadow:inset 0 0 0 1px #695541}
html[data-theme=dark] .cell button.hinted{box-shadow:inset 0 0 0 2px #d3ad54,0 0 0 2px #595037}
html[data-theme=dark] .get-app-title{color:#a6ac9e}
html[data-theme=dark] .store-badge{border:1px solid #3c4135;background:#1e2521d9;color:#d2e0d7}
html[data-theme=dark] .store-badge small{color:#acb3a6}
html[data-theme=dark] a.store-badge:hover{background:#151c17;border-color:#40453a}
html[data-theme=dark] .board th.col-clue.focus-axis .clue-button,html[data-theme=dark] .board th.col-clue.correction-axis .clue-button{background:none;box-shadow:none}
html[data-theme=dark] .board th.col-clue:not(.focus-axis,.correction-axis) .clue-button:hover:enabled,html[data-theme=dark] .board th.row-clue:not(.focus-axis,.correction-axis) .clue-button:hover:enabled{background:none}
html[data-theme=dark] .board th.col-clue:not(.focus-axis,.correction-axis) .clue-button:hover:enabled:before,html[data-theme=dark] .board th.row-clue:not(.focus-axis,.correction-axis) .clue-button:hover:enabled:before{background:#2d3830}
html[data-theme=dark] .board th.col-clue.focus-axis .clue-button:before,html[data-theme=dark] .board th.col-clue.correction-axis .clue-button:before{background:#31372a;box-shadow:inset 0 0 0 1px #4f5b44}
html[data-theme=dark] .board th.col-clue.correction-axis .clue-button:before,html[data-theme=dark] .board:has(.correction-target) th.col-clue.focus-axis .clue-button:before{background:#3d3125;box-shadow:inset 0 0 0 1px #695541}
html[data-theme=dark] .board th.row-clue.focus-axis .clue-button,html[data-theme=dark] .board th.row-clue.correction-axis .clue-button{background:none;box-shadow:none}
html[data-theme=dark] .board th.row-clue.focus-axis .clue-button:before,html[data-theme=dark] .board th.row-clue.correction-axis .clue-button:before{background:#31372a;box-shadow:inset 0 0 0 1px #4f5b44}
html[data-theme=dark] .board th.row-clue.correction-axis .clue-button:before,html[data-theme=dark] .board:has(.correction-target) th.row-clue.focus-axis .clue-button:before{background:#3d3125;box-shadow:inset 0 0 0 1px #695541}
html[data-theme=dark] .processing-switch{background:#171e1a}
html[data-theme=dark] .processing-switch span{color:#a4a99c}
html[data-theme=dark] .processing-switch button{color:#adb3a6}
html[data-theme=dark] .processing-switch button[aria-pressed="true"]{background:#1f2621;color:var(--green);box-shadow:0 1px 4px #00000024}
html[data-theme=dark] .add-line-button{border:1.5px dashed #7c886d;color:#bfc7ba;background:#1c231f}
html[data-theme=dark] .add-line-button:hover:enabled{background:#2c342e;border-color:#819371}
html[data-theme=dark] .line-tools .quiet{background:#161c18}
html[data-theme=dark] .line-tools .line-remove{color:#e9ad9f}
html[data-theme=dark] .app-version{color:#a1a698}
html[data-theme=dark] .engine-status{color:#a1a698}
html[data-theme=dark] .engine-status:before{border:1.5px solid #3f4439;border-top-color:var(--green)}
html[data-theme=dark] .loader{background:radial-gradient(120% 90% at 50% 38%,#1b221e 0%,#161d19 55%,#2d3530 100%)}
html[data-theme=dark] .loader-photo{background:#2d342f;border:4px solid #333734;box-shadow:0 26px 60px #00000053,0 0 0 1px #48554d}
html[data-theme=dark] .loader-placeholder{color:#a0a79a;background:linear-gradient(90deg,#303a34 1px,transparent 0) 0 0/20% 20%,linear-gradient(#303a34 1px,transparent 0) 0 0/20% 20%,#171e1a}
html[data-theme=dark] .loader-placeholder svg{background:#1e2521;box-shadow:0 8px 24px #00000038}
html[data-theme=dark] .loader-frame{box-shadow:0 0 0 999px #61786b40;background:linear-gradient(var(--c),var(--c)) top left/22px 3px,linear-gradient(var(--c),var(--c)) top left/3px 22px,linear-gradient(var(--c),var(--c)) top right/22px 3px,linear-gradient(var(--c),var(--c)) top right/3px 22px,linear-gradient(var(--c),var(--c)) bottom left/22px 3px,linear-gradient(var(--c),var(--c)) bottom left/3px 22px,linear-gradient(var(--c),var(--c)) bottom right/22px 3px,linear-gradient(var(--c),var(--c)) bottom right/3px 22px;background-repeat:no-repeat;filter:drop-shadow(0 1px 3px #0000007a)}
html[data-theme=dark] .loader-beam{background:linear-gradient(#2c473100,#2c47314d 80%,#1c231e calc(100% - 2px),#1c231e00)}
html[data-theme=dark] .loader-steps li+li:before,html[data-theme=dark] .progress-steps li+li:before{background:#303a34}
html[data-theme=dark] .loader-steps li:is([data-state=done],[data-state=active])+li:before,html[data-theme=dark] .progress-steps li:is([data-state=done],[data-state=active])+li:before{background:linear-gradient(90deg,#7f9a6d 50%,#303a34 0) 100% 0/200% 100%}
html[data-theme=dark] .loader-steps li[data-state=done]+li:before,html[data-theme=dark] .progress-steps li[data-state=done]+li:before{background:#7f9a6d}
html[data-theme=dark] .step-icon{background:#1e2521;border:1.5px solid #354139;color:#9da295}
html[data-theme=dark] .loader-steps small{color:#a0a598}
html[data-theme=dark] [data-state=done] .step-icon{background:#30362b;border-color:#3e4439;color:#a9d8b8}
html[data-theme=dark] [data-state=done] .step-icon:after{background:#3f6b4f;color:#ffffff;box-shadow:0 0 0 2px #484c49}
html[data-theme=dark] [data-state=done] small{color:#a6c39a}
html[data-theme=dark] [data-state=active] .step-icon{background:var(--green);border-color:var(--green);color:#10251b;box-shadow:0 8px 20px #00000073}
html[data-theme=dark] [data-state=active] .step-icon:before{border:2px solid #809b6e}
html[data-theme=dark] [data-state=active] small{color:var(--green)}
html[data-theme=dark] .loader-text strong{color:#d8e8e0}
html[data-theme=dark] .loader-text span{color:#b3b9ac}
html[data-theme=dark] .loader-fact{color:#b4baad;background:#1e2521b3;border:1px solid #353f39}
html[data-theme=dark] .loader-fact:before{color:#abcba0}
html[data-theme=dark] .progress-steps [data-state=active] .step-icon{box-shadow:0 3px 10px #0000005c}
html[data-theme=dark] .solution-card:is([data-stage=read],[data-stage=verify],[data-stage=solve]) .progress-icon{color:var(--green);background:radial-gradient(closest-side,#2e3430 calc(100% - 3px),transparent calc(100% - 2px)),conic-gradient(var(--green) var(--read-progress),#34392d 0)}
html[data-theme=dark] .solution-card[data-stage=solve] .progress-icon{background:#2e3430}
html[data-theme=dark] .solution-card[data-stage=solve] .progress-icon:before{border:2px solid #3b3f34;border-top-color:var(--green)}
html[data-theme=dark] .loader{background:none}
html[data-theme=dark] .loader:before{background:radial-gradient(120% 90% at 50% 38%,#1b221e 0%,#161d19 55%,#2d3530 100%)}
html[data-theme=dark] .loader:after{background:radial-gradient(46% 50% at 50% 52%,#19201cd9 0%,#181f1a99 55%,#161d1833 100%)}
html[data-theme=dark] .loader.over-board .loader-fact{background:#1e2521d9}
html[data-theme=dark] .scene-grid path{fill:none;stroke:#fffef9}
html[data-theme=dark] .scene-grid path.major{filter:drop-shadow(0 0 1.5px #00000099)}
html[data-theme=dark] .scene-grid .outline{fill:#a8dcb00f;stroke:#fffef9;filter:drop-shadow(0 0 3px #00000099)}
html[data-theme=dark] .scene-reads polygon{fill:#71c18d}
html[data-theme=dark] .loader[data-step=solve] .loader-photo:after{background:linear-gradient(115deg,transparent 35%,#1f26218c 50%,transparent 65%) 0 0/250% 100%}
html[data-theme=dark] .scene-choices polygon{fill:#a8dcb024;stroke:#fffef9;filter:drop-shadow(0 0 3px #00000099)}
html[data-theme=dark] .scene-choices circle{fill:var(--green);stroke:#fffef9;filter:drop-shadow(0 2px 4px #00000099)}
html[data-theme=dark] .scene-choices text{fill:#ffffff}
html[data-theme=dark] .scene-choices .hot polygon,html[data-theme=dark] .scene-choices .chosen polygon{fill:#a8dcb055}
html[data-theme=dark] .choice-chip{background:#1e2521;border:1px solid #354039;box-shadow:0 6px 18px #00000024}
html[data-theme=dark] .choice-chip img{background:#2d342f}
html[data-theme=dark] .choice-chip strong{color:#d8e8e0}
html[data-theme=dark] .choice-chip small{color:#acb3a5}
html[data-theme=dark] .choice-chip.hot{border-color:#809b6e;box-shadow:0 10px 24px #00000041}
html[data-theme=dark] .tool-caption{color:inherit}
html[data-theme=dark] .errors-button.has-errors{color:#f1ae79;background:#161d18;box-shadow:inset 0 0 0 1px #60513a}
html[data-theme=dark] .errors-button[aria-pressed=true]{color:#fab989;background:#403420;box-shadow:inset 0 0 0 1px #675740}
html[data-theme=dark] .errors-count{background:#c56d36;color:#ffffff}
html[data-theme=dark] .solve-status.error .quiet{color:#deb379}
html[data-theme=dark] .solve-status #errors-fix{background:var(--green);border:1px solid var(--green);color:#10251b}
html[data-theme=dark] .app-update{color:#9ec58f;text-decoration:underline dotted #98a093}
html[data-theme=dark] .app-update:before{color:#9b9f92;text-decoration:none}
html[data-theme=dark] .photo-subtitle{color:#a7ad9f}
html[data-theme=dark] .photo-zoom{background:#161d18}
html[data-theme=dark] .photo-viewer .photo-zoom button{background:#1e2521;border:1px solid #353f39;color:#b5d5ad}
html[data-theme=dark] .photo-level{color:#bfc7ba}
html[data-theme=dark] .photo-viewer .photo-fit{background:#161d18;color:#bfc7ba}
html[data-theme=dark] .photo-viewport{background:#2e3430;outline:none}
html[data-theme=dark] .photo-viewport .photo-stage img{box-shadow:0 8px 28px #00000041}
html[data-theme=dark] .photo-context{color:#a7ad9f}
html[data-theme=dark] .clue-subtitle{color:#a7ad9f}
html[data-theme=dark] .clue-photo{background:#1e2521;border:1px solid #353f39;color:#bfc7ba}
html[data-theme=dark] .clue-crop-wrap:not([hidden])+.clue-photo{box-shadow:0 2px 8px #00000024}
html[data-theme=dark] .clue-editor .line-tools{border-top:1px solid #353d38}
html[data-theme=dark] .line-label{color:#b5bdb0}
html[data-theme=dark] .clue-editor .line-tools button{background:#161d18;color:#bfc7ba}
html[data-theme=dark] .clue-editor .line-tools .line-remove{background:transparent;color:#e9ad9f}
html[data-theme=dark] .clue-editor .line-tools .line-remove:hover:enabled{background:#2d3430}
html[data-theme=dark] .settings-engine{color:#a7ad9f}
html[data-theme=dark] .difficulty{border-top:1px solid #343d37}
html[data-theme=dark] .difficulty-tier i{background:#2f3832}
html[data-theme=dark] .difficulty-tier i.on{background:var(--green)}
html[data-theme=dark] #difficulty-name{color:var(--green)}
html[data-theme=dark] #difficulty-meta{color:#c2cabd}
html[data-theme=dark] .difficulty-techniques li{background:#2c342e;color:#b5d5aa}
html[data-theme=dark] .difficulty-techniques li.hard{background:#151c17;color:#f4b97e}
html[data-theme=dark] .difficulty-why{color:var(--green)}
html[data-theme=dark] .difficulty-reason{color:#c9d2c5}
html[data-theme=dark] .board-area .hint-card{background:#1e2521;border:1px solid #354039;box-shadow:0 -6px 40px #00000041}
html[data-theme=dark] .hint-icon{background:#2c342e;color:var(--green)}
html[data-theme=dark] #hint-title{color:#d3e3da}
html[data-theme=dark] #hint-text{color:#c9d2c5}
html[data-theme=dark] .hint-diagram-row span{background:#2f3431}
html[data-theme=dark] .hint-diagram-row span.covered{background:#3a4734}
html[data-theme=dark] .hint-diagram-row span.known{background:#7d9a86}
html[data-theme=dark] .hint-diagram-row span.new{background:var(--green)}
html[data-theme=dark] .hint-diagram-row span.cross{background:#181f1a;box-shadow:inset 0 0 0 1px #4d5650}
html[data-theme=dark] .hint-diagram-row span.new-cross{background:#151c17;box-shadow:inset 0 0 0 1px #62543d}
html[data-theme=dark] .hint-diagram-legend{color:#bfc7b9}
html[data-theme=dark] .board td.cell button.suggest-fill:not(.filled){background:#9fcb8e}
html[data-theme=dark] .board td.cell button.suggest-cross:not(.filled){background:#151c17}
html[data-theme=dark] .cell button.suggest-cross:before,html[data-theme=dark] .cell button.suggest-cross:after{background:#c98a2e}
html[data-theme=dark] .board th.row-clue.hint-line .clue-button,html[data-theme=dark] .board th.col-clue.hint-line .clue-button{color:#ffffff}
html[data-theme=dark] .board th.row-clue.hint-line .clue-button:before,html[data-theme=dark] .board th.col-clue.hint-line .clue-button:before{background:var(--green);box-shadow:none}
html[data-theme=dark] .welcome-new{border:1px solid #37433b;background:#1e2520;color:#b5d5aa}
html[data-theme=dark] .draw-panel{background:#1e2521eb;border:1px solid #354039}
html[data-theme=dark] .draw-row{border-bottom:1px solid #343d37;color:#d3e3da}
html[data-theme=dark] .draw-mark{background:#30372b;color:var(--green)}
html[data-theme=dark] .draw-mark.warn{background:#151c17;color:#f1ae72}
html[data-theme=dark] .draw-mark.wait{background:#2d342f;color:#bfc7b9}
html[data-theme=dark] .draw-fix{background:#c98a2e;color:#ffffff}
html[data-theme=dark] .draw-other{border:1px solid #474136;background:#1c231e;color:#f4b97e}
html[data-theme=dark] .draw-other[aria-pressed=true]{background:#151c17}
html[data-theme=dark] .board td.cell button.ambiguous{box-shadow:inset 0 0 0 2px #c98a2e}
html[data-theme=dark] .board td.cell button.ambiguous:not(.filled){background:#151c17}
html[data-theme=dark] .board td.cell button.ambiguous.filled{background:#c98a2e}
html[data-theme=dark] .view-eyebrow{color:#c0c9bc;background:#2c342e;border:1px solid #3b3f33}
html[data-theme=dark] .view-title{color:#d8e8e0}
html[data-theme=dark] .main-nav a{color:#c2cabd}
html[data-theme=dark] .main-nav a:hover{background:#2d342f}
html[data-theme=dark] .main-nav a[aria-current=page]{background:#30372b;color:var(--green)}
html[data-theme=dark] .nav-profile{background:linear-gradient(135deg,#367457 0%,#245640 100%);color:#ffffff}
html[data-theme=dark] .nav-profile[aria-current=page]{box-shadow:0 0 0 3px #495242}
html[data-theme=dark] .tab-bar{background:#1e2521f2;border-top:1px solid #354039}
html[data-theme=dark] .tab-bar a{color:#bfc7b9}
html[data-theme=dark] .tab-bar a[aria-current=page]{color:var(--green)}
html[data-theme=dark] .tab-scan-button{background:linear-gradient(135deg,#367457 0%,#245640 100%);color:#ffffff;box-shadow:0 8px 18px #0000008b}
html[data-theme=dark] .tab-scan[aria-current=page] .tab-scan-button{box-shadow:0 0 0 4px #495242,0 8px 18px #0000008b}
html[data-theme=dark] .today-hero{background:linear-gradient(135deg,#367457 0%,#245640 100%);color:#ffffff;box-shadow:0 22px 50px #00000073}
html[data-theme=dark] .today-hero-go{background:#1f2621;color:#b0e5ca}
html[data-theme=dark] .today-hero-board{background:#1f26211f}
html[data-theme=dark] .today-hero-board i{background:#1f262124}
html[data-theme=dark] .today-hero-board i.on{background:#1f2621a6}
html[data-theme=dark] .today-card{background:#1e2521f2;border:1px solid #354039;color:#d3e3da}
html[data-theme=dark] .today-card small{color:#c2cabd}
html[data-theme=dark] .today-card-icon{background:#30372b;color:var(--green)}
html[data-theme=dark] .today-card-icon.draw{background:#2c3730;color:#f4b97e}
html[data-theme=dark] .sets-stars,html[data-theme=dark] .pack-stars{background:#171e1a;color:#ecbc76}
html[data-theme=dark] .sets-stars svg,html[data-theme=dark] .pack-stars svg{fill:#c29848}
html[data-theme=dark] .pack-header{border-bottom:1px solid #eeeeee10;color:#f0e5d9}
html[data-theme=dark] .pack-back{color:inherit}
html[data-theme=dark] .pack-stars{background:#1f262199}
html[data-theme=dark] .pack-progress span{background:#1f262199}
html[data-theme=dark] .pack-progress i{background:var(--green)}
html[data-theme=dark] .pack-tile{color:#d3e3da}
html[data-theme=dark] .pack-tile.solved{background:#1e2521;border:1px solid #354039}
html[data-theme=dark] .pack-tile-stars{color:#c29848}
html[data-theme=dark] .pack-tile.current{background:#1e2521;border:3px solid var(--green);box-shadow:0 0 0 5px #72a68f1f}
html[data-theme=dark] .pack-tile.locked{background:#2f3431;color:#bfc7b9}
html[data-theme=dark] .pack-tile-number{color:inherit}
html[data-theme=dark] .pack-tile.current .pack-tile-number{color:var(--green)}
html[data-theme=dark] .pack-tile-go{background:var(--green);color:#10251b}
html[data-theme=dark] .pack-surprise{border:2px dashed #4a4439;background:#2c373080}
html[data-theme=dark] .pack-fragments i{background:#3f382a}
html[data-theme=dark] .pack-surprise strong{color:#e1d5ca}
html[data-theme=dark] .pack-surprise small{color:#d5cabe}
html[data-theme=dark] .play-bar{background:#1e2521eb;border:1px solid #354039}
html[data-theme=dark] .play-back{color:#d3e3da}
html[data-theme=dark] .play-title span{color:#bfc7b9}
html[data-theme=dark] .play-timer{color:#c9d2c5;background:#2d342f}
html[data-theme=dark] .play-lives svg{fill:#faa18d}
html[data-theme=dark] .play-lives svg.lost{fill:none;stroke:#c9cfbf}
html[data-theme=dark] .play-progress{background:#2e3731}
html[data-theme=dark] .play-progress i{background:var(--green)}
html[data-theme=dark] .play-overlay{background:#181f1ae6}
html[data-theme=dark] .play-overlay-card strong{color:#d8e8e0}
html[data-theme=dark] .play-overlay-card p{color:#c2cabd}
html[data-theme=dark] .done-stars svg{fill:#e4e0d2}
html[data-theme=dark] .done-stars svg.on{fill:#c29848}
html[data-theme=dark] .done-picture{background:#1e2521;border:1px solid #354039;box-shadow:0 22px 50px #00000038}
html[data-theme=dark] .done-picture .pixel-grid{background:#161d19}
html[data-theme=dark] .done-original{background:#161d19}
html[data-theme=dark] .done-heading h1{color:#d8e8e0}
html[data-theme=dark] .done-heading span{color:#c2cabd}
html[data-theme=dark] .done-stats{background:#1e2521f2;border:1px solid #354039}
html[data-theme=dark] .done-stats div+div{border-left:1px solid #343d37}
html[data-theme=dark] .done-stats span{color:#bfc7b9}
html[data-theme=dark] .today-continue-bar{background:#2e3731}
html[data-theme=dark] .today-continue-bar i{background:var(--green)}
html[data-theme=dark] .scanner-note{color:#b5d5aa;background:#2c342e}
html[data-theme=dark] .scanner-new{border:1px solid #37433b;background:#1e2520;color:#b5d5aa}
html[data-theme=dark] .library-tabs{background:#2d342f}
html[data-theme=dark] .library-tabs button{color:#c2cabd}
html[data-theme=dark] .library-tabs button[aria-selected=true]{background:#1f2621;box-shadow:0 1px 4px #00000024;color:var(--green)}
html[data-theme=dark] .library-item{background:#1e2521eb;border:1px solid #354039;color:#d3e3da}
html[data-theme=dark] .library-thumb{background-color:#151c18;background-image:linear-gradient(#354039 1px,transparent 1px),linear-gradient(90deg,#354039 1px,transparent 1px);box-shadow:inset 0 0 0 1px #4a574e}
html[data-theme=dark] .library-text small{color:#c2cabd}
html[data-theme=dark] .library-progress span{background:#2e3731}
html[data-theme=dark] .library-progress i{background:var(--green)}
html[data-theme=dark] .library-progress.complete i{background:#94a682}
html[data-theme=dark] .library-progress b{color:#c2cabd}
html[data-theme=dark] .library-empty{border:1px dashed #37433b;color:#c2cabd}
html[data-theme=dark] .board-back{color:#d3e3da}
html[data-theme=dark] .board th.line-done .clue-button{color:#c3cab9}
html[data-theme=dark] .board th.line-done.hint-line .clue-button{color:#ffffff}
@media(min-width:1100px){
html[data-theme=dark] .puzzle.playing .play-bar{background:none}
html[data-theme=dark] .puzzle.playing .play-back{color:var(--green)}
html[data-theme=dark] .puzzle.playing .play-heading{color:#d8e8e0}
html[data-theme=dark] .puzzle.playing .play-title span#play-meta{color:#c2cabd}
html[data-theme=dark] .puzzle.playing .play-stats{background:#1e2521f2;border:1px solid #354039}
html[data-theme=dark] .puzzle.playing .play-timer{background:none}
html[data-theme=dark] .puzzle.playing .play-keys{border:1px dashed #37433b;color:#c2cabd}
html[data-theme=dark] .play-keys kbd{background:#1f2621;border:1px solid #39413c;box-shadow:0 1px 0 #00000099;color:#c9d2c5}
html[data-theme=dark] .play-side .hint-card{background:#1e2521;border:1px solid #354039;box-shadow:0 16px 40px #00000032}
html[data-theme=dark] .play-pack{background:var(--pack-bg,#2c342e);color:#f0e5d9}
html[data-theme=dark] .play-pack-dots i{background:#1f262199}
html[data-theme=dark] .play-pack-dots i.current{background:var(--green)}
}
html[data-theme=dark] .print-preview .print-sheet{box-shadow:0 18px 40px #00000053,0 1px 0 #00000099}
html[data-theme=dark] .print-option{background:#1e2521f2;border:1px solid #354039}
html[data-theme=dark] .print-option small{color:#bfc7b9}
html[data-theme=dark] .print-option input{accent-color:var(--green)}
html[data-theme=dark] .print-note{color:#c2cabd}
html[data-theme=dark] .done-pack{color:var(--green)}
html[data-theme=dark] .print-sheet{background:#1f2621;color:#dfeee5}
html[data-theme=dark] .print-mark{background:#111111;box-shadow:inset 0 0 0 1.4mm #4f4f4f,inset 0 0 0 2.4mm #484848}
html[data-theme=dark] .print-meta{color:#c3ccc0}
html[data-theme=dark] .print-clue{color:#dfeee5}
html[data-theme=dark] .print-cells{border:.6mm solid #d4d4d4}
html[data-theme=dark] .print-cells i{border-right:.15mm solid #8c8c8c;border-bottom:.15mm solid #8c8c8c}
html[data-theme=dark] .print-cells i.r5{border-right:.45mm solid #d4d4d4}
html[data-theme=dark] .print-cells i.b5{border-bottom:.45mm solid #d4d4d4}
html[data-theme=dark] .print-foot{color:#c3ccc0}
html[data-theme=dark] .pack-print{background:#1f262199;color:inherit}
html[data-theme=dark] .login-board{background:#1e2521;border:1px solid #354039;box-shadow:0 18px 40px #00000038}
html[data-theme=dark] .login-board i{background:#2d342f}
html[data-theme=dark] .login-board i.on{background:var(--green)}
html[data-theme=dark] .login-head p{color:#c2cabd}
html[data-theme=dark] .login-tabs{background:#2f3431}
html[data-theme=dark] .login-tabs button{background:none;color:#c2cabd}
html[data-theme=dark] .login-tabs button[aria-selected=true]{background:#1f2621;color:#d3e3da;box-shadow:0 1px 3px #0000002f}
html[data-theme=dark] .login-field label{color:#c2cabd}
html[data-theme=dark] .login-field input{border:1px solid #37433b;background:#1f2621;color:#d3e3da}
html[data-theme=dark] .login-field input[aria-invalid=true]{border-color:#b6796f;background:#1a211c}
html[data-theme=dark] .login-eye{background:none;color:#bfc7b9}
html[data-theme=dark] .login-hint{color:#bfc7b9}
html[data-theme=dark] .login-benefits{background:#1e2521f2;border:1px solid #354039;color:#c2cabd}
html[data-theme=dark] .login-benefits b{color:#d3e3da}
html[data-theme=dark] .login-error{background:#2e3832;color:#ffc4b5}
html[data-theme=dark] .login-note{background:#151c17;color:#f2ca99}
html[data-theme=dark] .login-link{color:var(--green)}
html[data-theme=dark] .login-legal{color:#bfc7b9}
html[data-theme=dark] .login-legal a{color:inherit}
html[data-theme=dark] .refund-sheet h2{color:#d8e8e0}
html[data-theme=dark] .refund-text{color:#c2cabd}
html[data-theme=dark] .shop-closed{background:#151c17;color:#f2ca99}
html[data-theme=dark] .shop-closed b{color:#fad4a9}
html[data-theme=dark] .login-skip{color:#c2cabd}
html[data-theme=dark] .login-back{color:#c2cabd}
html[data-theme=dark] .login-mail{background:#30372b;color:var(--green)}
html[data-theme=dark] .account-avatar{background:linear-gradient(135deg,#367457 0%,#245640 100%);color:#ffffff}
html[data-theme=dark] .account-who span{color:#c2cabd}
html[data-theme=dark] .account-who small{color:#bfc7b9}
html[data-theme=dark] .account-stats{background:#1e2521f2;border:1px solid #354039}
html[data-theme=dark] .account-stats div+div{border-left:1px solid #343d37}
html[data-theme=dark] .account-stats span{color:#bfc7b9}
html[data-theme=dark] .account-levels{background:#1e2521f2;border:1px solid #354039}
html[data-theme=dark] .account-level{color:#c2cabd}
html[data-theme=dark] .account-level span:nth-child(2){background:#2d342f}
html[data-theme=dark] .account-level i{background:var(--green)}
html[data-theme=dark] .account-level b{color:#d3e3da}
html[data-theme=dark] .account-note{color:#bfc7b9}
html[data-theme=dark] .account-delete{color:#ffaa9c}
html[data-theme=dark] .account-confirm{background:#2e3832;color:#ffc4b5}
html[data-theme=dark] .button.danger{background:#a8463b;border-color:#ea8173}
html[data-theme=dark] .guest-handle{background:#343b37}
html[data-theme=dark] .guest-lock{background:#2c342e;color:var(--green)}
html[data-theme=dark] .guest-head h2{color:#d8e8e0}
html[data-theme=dark] .guest-head span{color:#c2cabd}
html[data-theme=dark] .guest-label{color:#bfc7b9}
html[data-theme=dark] .guest-list{border:1px solid #354039}
html[data-theme=dark] .guest-row+.guest-row{border-top:1px solid #343d37}
html[data-theme=dark] .guest-row em{color:#f1ae72}
html[data-theme=dark] .guest-row em.done{color:var(--green)}
html[data-theme=dark] .guest-later{color:#c2cabd}
html[data-theme=dark] .pack-tile.account{background:#2f3431;color:#bfc7b9}
html[data-theme=dark] .pack-tile.account:after{border:2px solid #858e7c}
html[data-theme=dark] .board td.cell.focus-line,html[data-theme=dark] .board:has(.correction-target) td.cell.focus-line{background:transparent}
html[data-theme=dark] .board td.cell[class*=band-]:after{border:0 solid var(--green)}
html[data-theme=dark] .board td.cell.band-row:after{border-top-width:max(2px,calc(var(--cell)*.09));border-bottom-width:max(2px,calc(var(--cell)*.09))}
html[data-theme=dark] .board td.cell.band-row.band-start:after{border-left-width:max(2px,calc(var(--cell)*.09))}
html[data-theme=dark] .board td.cell.band-row.band-end:after{border-right-width:max(2px,calc(var(--cell)*.09))}
html[data-theme=dark] .board td.cell.band-col:after{border-left-width:max(2px,calc(var(--cell)*.09));border-right-width:max(2px,calc(var(--cell)*.09))}
html[data-theme=dark] .board td.cell.band-col.band-start:after{border-top-width:max(2px,calc(var(--cell)*.09))}
html[data-theme=dark] .board td.cell.band-col.band-end:after{border-bottom-width:max(2px,calc(var(--cell)*.09))}
html[data-theme=dark] .board td.cell button.suggest-fill:not(.filled){background:repeating-linear-gradient(135deg,#9fcb8e 0 3px,#30392a 3px 6px)}
html[data-theme=dark] .board td.cell button.suggest-cross:not(.filled){background:#151c17}
html[data-theme=dark] .cell button.suggest-cross:before,html[data-theme=dark] .cell button.suggest-cross:after{background:#6f9a72}
html[data-theme=dark] .cell button.correction-target{box-shadow:inset 0 0 0 max(1px,calc(var(--cell)*.08)) #b4493c;background:#2c352f}
html[data-theme=dark] .cell button.correction-target.filled{background:#8e3b31}
html[data-theme=dark] .cell button.correction-target:focus-visible{outline:2px solid #eb7a6a}
html[data-theme=dark] .board:has(.correction-target) th.focus-axis .clue-button{background:#2c352f;color:#ffaa9c;box-shadow:inset 0 0 0 1px #70534d}
html[data-theme=dark] .board th.col-clue.correction-axis .clue-button:before,html[data-theme=dark] .board:has(.correction-target) th.col-clue.focus-axis .clue-button:before,html[data-theme=dark] .board th.row-clue.correction-axis .clue-button:before,html[data-theme=dark] .board:has(.correction-target) th.row-clue.focus-axis .clue-button:before{background:#2c352f;box-shadow:inset 0 0 0 1px #70534d}
html[data-theme=dark] .hint-handle{background:#343b37}
html[data-theme=dark] .hint-collapse{color:#c2cabd}
@media(min-width:1100px){
html[data-theme=dark] .board-side .hint-card{box-shadow:0 16px 40px #00000032}
}
html[data-theme=dark] .cell button.fixed{box-shadow:inset 0 0 0 max(1px,calc(var(--cell)*.06)) #d9a093}
html[data-theme=dark] .cell button.fixed.empty{background:#2c352f;color:#ffa698}
html[data-theme=dark] .cell button.fixed.filled{background:#7c3a31}
html[data-theme=dark] .board td.cell.fixed-cell:before{background:#b4493c;border:1.5px solid #353535}
html[data-theme=dark] .mistake-toast{background:#1f2621;border:1px solid #4a3d3a;box-shadow:0 10px 30px #0000003d;color:#d3e3da}
html[data-theme=dark] .mistake-toast b{color:#ffa698}
html[data-theme=dark] .mistake-toast-icon{background:#2c352f}
html[data-theme=dark] .heart-break svg{fill:#faa18d;stroke:none}
html[data-theme=dark] .rules-list{color:#c8d6cd}
html[data-theme=dark] .rules-list b{color:#d3e3da}
html[data-theme=dark] .print-page{color:#c3ccc0}
html[data-theme=dark] .print-pick-item{background:#1e2521f2;border:1px solid #354039}
html[data-theme=dark] .print-pick-item input{accent-color:var(--green)}
html[data-theme=dark] .print-pick-item small{color:#bfc7b9}
html[data-theme=dark] .library-print{color:#c2cabd}
html[data-theme=dark] .library-print:hover{background:#2d342f}
@media(min-width:761px){
html[data-theme=dark] .today-drop{border:2px dashed #43493e;background:#181e1aee}
html[data-theme=dark] .today-drop-main{color:#d3e3da}
html[data-theme=dark] .today-drop-main small{color:#c2cabd}
html[data-theme=dark] .today-drop-icon{background:var(--green);color:#10251b}
html[data-theme=dark] .today-recent-item{background:#1e2521;border:1px solid #354039}
html[data-theme=dark] .today-recent-item small{color:#bfc7b9}
html[data-theme=dark] .today-packs-head a{color:var(--green)}
html[data-theme=dark] .today-pack{color:#f0e5d9}
html[data-theme=dark] .today-pack-bar{background:#1f262199}
html[data-theme=dark] .today-pack-cover{background:#1e2521b3}
}
html[data-theme=dark] .manual-coach p{color:#c8d6cd}
html[data-theme=dark] .board th.coach-clue .clue-button{background:#171e19;color:#f2bc7c;box-shadow:0 0 0 2px #695b43}
html[data-theme=dark] .account-menu{color:#b2baae}
html[data-theme=dark] .account-menu:hover,html[data-theme=dark] .account-menu[aria-expanded=true]{background:#2d342f}
html[data-theme=dark] .account-xp>div{color:#c2cabd}
html[data-theme=dark] .account-xp-bar{background:#2e3731}
html[data-theme=dark] .account-xp-bar i{background:var(--green)}
html[data-theme=dark] .account-stats b.hot{color:#f1ae72}
html[data-theme=dark] .account-badges-head span{color:#bfc7b9}
html[data-theme=dark] .account-badge span{background:#2f3431;color:#999f91}
html[data-theme=dark] .account-badge.got span{background:#30372b;color:var(--green)}
html[data-theme=dark] .account-badge small{color:#bfc7b9}
html[data-theme=dark] .account-badge.got small{color:#c9d2c5}
html[data-theme=dark] .account-badge em{color:#bfc7b9}
html[data-theme=dark] .nav-streak{background:#151c17;color:#f7ba7d}
html[data-theme=dark] .nav-streak svg{fill:#d89e5a}
html[data-theme=dark] .nav-streak.cold svg{fill:#e2c49b}
html[data-theme=dark] .nav-xp{background:#2c342e;color:var(--green)}
html[data-theme=dark] .today-goal{background:#1e2521eb;border:1px solid #354039;color:#d3e3da}
html[data-theme=dark] .goal-ring{background:conic-gradient(var(--green) 0 var(--goal),#2f3832 var(--goal) 100%)}
html[data-theme=dark] .goal-ring b{background:#1e2521}
html[data-theme=dark] .today-goal-text small{color:#c2cabd}
html[data-theme=dark] .goal-day{color:#bfc7b9}
html[data-theme=dark] .goal-day i{background:#161d18;border:2px solid transparent}
html[data-theme=dark] .goal-day svg{fill:#d9dccf}
html[data-theme=dark] .goal-day.met i{background:#151c17}
html[data-theme=dark] .goal-day.met svg{fill:#d89e5a}
html[data-theme=dark] .goal-day.frozen i{background:#2e3430}
html[data-theme=dark] .goal-day.frozen svg{fill:none;stroke:#90c3f0}
html[data-theme=dark] .goal-day.today i{background:#1e2521;border-color:#c07b17}
html[data-theme=dark] .goal-day.today svg{fill:#e9d3b3}
html[data-theme=dark] .streak{background:#181f1a}
html[data-theme=dark] .streak-inner{color:#f0e5d9}
html[data-theme=dark] .streak-art i.fire{background:#d9822b}
html[data-theme=dark] .streak-art i.core{background:#4d3e20}
html[data-theme=dark] .streak-flame b{background:#1f2621;box-shadow:0 6px 18px #00000073;color:#f1ae72}
html[data-theme=dark] .streak-head h1{color:#f0e5d9}
html[data-theme=dark] .streak-head p{color:#cec3b8}
html[data-theme=dark] .streak-week{background:#1f2621;border:1px solid #423c31}
html[data-theme=dark] .streak-card{background:#1f2621;border:1px solid #423c31}
html[data-theme=dark] .streak-card small{color:#cec3b8}
html[data-theme=dark] .streak-card-icon.freeze{background:#2e3430;color:#90c3f0}
html[data-theme=dark] .streak-card-icon.award{background:#30372b;color:var(--green)}
html[data-theme=dark] .streak-remind{background:#1f262199}
html[data-theme=dark] .streak-remind svg{color:#f1ae72}
html[data-theme=dark] .streak-remind input{accent-color:#a8641a}
html[data-theme=dark] .done-goal{background:#161d18;color:#c2cabd}
html[data-theme=dark] .done-goal svg{fill:#e2c49b}
html[data-theme=dark] .done-goal.met{background:#151c17;color:#f1ae72}
html[data-theme=dark] .done-goal.met svg{fill:#d89e5a}
html[data-theme=dark] .daily-day{color:#bfc7b9}
html[data-theme=dark] .daily-day span{background:#2f3431;color:#a0a799}
html[data-theme=dark] .daily-day.solved span{background:var(--green);color:#10251b}
html[data-theme=dark] .daily-day.today{background:#30372b}
html[data-theme=dark] .daily-day.today:not(.solved) span{background:#1f2621;color:var(--green);box-shadow:inset 0 0 0 2px var(--green)}
html[data-theme=dark] .daily-card{background:#1e2521f2;border:1px solid #354039}
html[data-theme=dark] .daily-picture{background:#161d19}
html[data-theme=dark] .daily-eyebrow{color:#bfc7b9}
html[data-theme=dark] .daily-card-text span:last-child{color:#b5d5aa}
html[data-theme=dark] .daily-share{color:#b5d5aa}
html[data-theme=dark] .daily-board-head span{color:#bfc7b9}
html[data-theme=dark] .daily-board{background:#1e2521f2;border:1px solid #354039}
html[data-theme=dark] .daily-row+.daily-row{border-top:1px solid #343d37}
html[data-theme=dark] .daily-row b{color:#bfc7b9}
html[data-theme=dark] .daily-row.medal-1 b{background:#463b1b;color:#efce8c}
html[data-theme=dark] .daily-row.medal-2 b{background:#363a38;color:#c8d3df}
html[data-theme=dark] .daily-row.medal-3 b{background:#543b24;color:#ffcaa6}
html[data-theme=dark] .daily-row i{color:#ffffff;background:#7d9a8a}
html[data-theme=dark] .daily-row.you{background:#30372b;border-top-color:transparent}
html[data-theme=dark] .daily-row.you i{background:var(--green)}
html[data-theme=dark] .daily-gap{color:#a0a799}
html[data-theme=dark] .daily-empty{color:#bfc7b9}
html[data-theme=dark] .daily-note{color:#bfc7b9}
html[data-theme=dark] .daily-note a{color:var(--green)}
html[data-theme=dark] #draw-level-row.pending{color:#a0a799}
@media(min-width:1100px){
html[data-theme=dark] .puzzle:not(.playing) .board-side:empty:before,html[data-theme=dark] .puzzle:not(.playing) .board-side:not(:has(>:not([hidden]))):before{border:1.5px dashed #37433b;color:#a0a799}
}
html[data-theme=dark] .notification{box-shadow:0 10px 30px #00000044}
html[data-theme=dark] .notification-close{background:#161d18;color:#c2cabd}
html[data-theme=dark] .notification-timer{background:#a5bd92}
html[data-theme=dark] .lock-card-icon{background:#2f3431;color:#bfc7b9}
html[data-theme=dark] .lock-card p{color:#c2cabd}
html[data-theme=dark] .lock-card-meter{background:#313833}
html[data-theme=dark] .lock-card-meter i{background:#e0a72e}
html[data-theme=dark] .lock-card-close{color:#c2cabd}
html[data-theme=dark] .photo-switcher{background:#1e2521;border:1px solid #354039}
html[data-theme=dark] .photo-switcher img{background:#2e3731}
html[data-theme=dark] .photo-switcher-go{color:var(--green);background:#2d342f}
html[data-theme=dark] .photo-puzzles h2{color:#d8e8e0}
html[data-theme=dark] .photo-puzzle{border:1px solid #354039;background:#1f2621}
html[data-theme=dark] .photo-puzzle.current{border:2px solid var(--green)}
html[data-theme=dark] .photo-puzzle img{background:#2e3731}
html[data-theme=dark] .photo-puzzle small{color:#c2cabd}
html[data-theme=dark] .user-menu{background:#1e2521;border:1px solid #354039;box-shadow:0 18px 40px #0000004a}
html[data-theme=dark] .user-menu-who{border-bottom:1px solid #343d37}
html[data-theme=dark] .user-menu-who small{color:#c2cabd}
html[data-theme=dark] .user-menu a,html[data-theme=dark] .user-menu button{color:#d3e3da}
html[data-theme=dark] .user-menu a:hover,html[data-theme=dark] .user-menu button:hover,html[data-theme=dark] .user-menu a:focus-visible,html[data-theme=dark] .user-menu button:focus-visible{background:#2d342f;outline:none}
html[data-theme=dark] .user-menu-muted{color:#bfc7b9}
html[data-theme=dark] .user-menu hr{border-top:1px solid #343d37}
html[data-theme=dark] .settings-group{background:#1e2521f2;border:1px solid #354039}
html[data-theme=dark] .settings-group>b{color:#bfc7b9}
html[data-theme=dark] .settings-row+.settings-row{border-top:1px solid #343d37}
html[data-theme=dark] .settings-row span{color:#c2cabd}
html[data-theme=dark] .settings-row input{accent-color:var(--green)}
html[data-theme=dark] .settings-link{color:var(--green)}
html[data-theme=dark] .settings-note{color:#c2cabd}
html[data-theme=dark] .difficulty-reason{background:#1e2521;border:1px solid #354039;color:#c8d6cd}
html[data-theme=dark] .difficulty-reason small{color:#bfc7b9}
html[data-theme=dark] .progress-act{color:#c2cabd}
html[data-theme=dark] .progress-act.primary-act{background:#151c17;color:#f1ae72}
html[data-theme=dark] .daily-day.late span{background:#1f2621;color:var(--green);box-shadow:inset 0 0 0 2px #9fbf9a}
html[data-theme=dark] .daily-day.late span:after{background:#9fbf9a;color:#ffffff}
html[data-theme=dark] .save-bar{background:#1a211d;border:1px solid #454034}
html[data-theme=dark] .save-bar b{color:#f2ca99}
html[data-theme=dark] .save-bar button{background:var(--green);color:#10251b}
html[data-theme=dark] .save-sheet h2,html[data-theme=dark] .archive-video h2{color:#d8e8e0}
html[data-theme=dark] .save-sheet p{color:#c2cabd}
html[data-theme=dark] .library-menu .danger-item{color:#ffaa9c}
html[data-theme=dark] .library-rename{border:1px solid #3b473f}
html[data-theme=dark] .notification-action{background:#2d342f;color:var(--green)}
html[data-theme=dark] .complete{background:radial-gradient(circle at 50% 28%,#1a211c,#2c3730 72%)}
html[data-theme=dark] .complete-inner{color:#f0e5d9}
html[data-theme=dark] .complete-picture{background:#1f2621;box-shadow:0 18px 40px #0000005c}
html[data-theme=dark] .complete-picture i{background:#2e3531}
html[data-theme=dark] .complete h1{color:#f0e5d9}
html[data-theme=dark] .complete-inner p{color:#cec3b8}
html[data-theme=dark] .complete-prize>div{background:#1f2621;border:1px solid #423c31}
html[data-theme=dark] .complete-prize small{color:#cec3b8}
html[data-theme=dark] .complete-bonus{border:2px dashed #ad7700!important;background:#1a211d!important}
html[data-theme=dark] .pack-bonus{border:2px dashed #ad7700;background:#1a211d;color:#f1ae72}
html[data-theme=dark] .pack-bonus small{color:#cdc3b7}
html[data-theme=dark] .pack-bonus.closed{border-color:#3a463e;background:#161d19;color:#bdb3a7}
html[data-theme=dark] .sets-note.offline{background:#161c18;border:1px solid #443f34;color:#dfbc84}
html[data-theme=dark] .sets-note.fresh{background:#30372b;border:1px solid #3c4237;color:var(--green)}
html[data-theme=dark] .sets-note.guest{background:#1e2521;border:1px solid #354039;color:#c2cabd}
html[data-theme=dark] .sets-note.guest b{color:#d3e3da}
html[data-theme=dark] .sets-continue{background:#1e2521f2;border:1px solid #354039;box-shadow:0 8px 24px #00000024}
html[data-theme=dark] .sets-continue-text small{color:#c0c9bc}
html[data-theme=dark] .sets-continue-text strong{color:#d3e3da}
html[data-theme=dark] .sets-continue-text em{color:#c2cabd}
html[data-theme=dark] .theme-chip{background:#1e2521;border:1px solid #354039;color:#c2cabd}
html[data-theme=dark] .theme-chip[aria-pressed=true]{background:var(--green);border-color:var(--green);color:#10251b}
html[data-theme=dark] section.band-row.fresh{outline:3px solid #6d8c59}
html[data-theme=dark] .band-head h2{color:#d8e8e0}
html[data-theme=dark] .band-head small{color:#bfc7b9}
html[data-theme=dark] .band-all{color:var(--green)}
html[data-theme=dark] .band-arrow{background:#1e2521;border:1px solid #354039;color:#c2cabd}
html[data-theme=dark] .pack-card{color:#d3e3da}
html[data-theme=dark] .pack-card-cover{background:#2f3431}
html[data-theme=dark] .pack-card small{color:#bfc7b9}
html[data-theme=dark] .pack-card small b{color:#ecbc76}
html[data-theme=dark] .pack-card-bar{background:#2f3832}
html[data-theme=dark] .pack-card-bar i{background:var(--green)}
html[data-theme=dark] .pack-card-new{background:#1e2521;color:#eeb878;box-shadow:0 2px 6px #0000001f}
html[data-theme=dark] .pack-card-done{background:var(--green);color:#10251b}
html[data-theme=dark] .pack-card-account{background:#1e2521;color:#b2b9ac;box-shadow:0 2px 6px #0000001f}
html[data-theme=dark] .pack-card-soon .pack-card-cover{background:#1e2521;border:1.5px dashed #38443c;color:#bfc7b9}
html[data-theme=dark] .pack-card-skeleton .pack-card-cover{background:linear-gradient(90deg,#2f3431,#181e1a,#2f3431)}
html[data-theme=dark] .pack-card-skeleton strong,html[data-theme=dark] .pack-card-skeleton small{background:#303632}
html[data-theme=dark] .band-empty{border:1px dashed #38443c;color:#bfc7b9}
html[data-theme=dark] .band-locked{background:#2f3431;color:#c2cabd}
html[data-theme=dark] .band-lock-icon{background:#1e2521;color:#b2b9ac}
html[data-theme=dark] .band-locked-text small{color:#bfc7b9}
html[data-theme=dark] .band-locked .pack-card-bar{background:#323b35}
html[data-theme=dark] .band-lock h2{color:#d8e8e0}
html[data-theme=dark] .band-lock p{color:#c2cabd}
html[data-theme=dark] .band-lock-step b{color:#bfc7b9}
html[data-theme=dark] .band-lock-step b.done{color:var(--green)}
html[data-theme=dark] .band-view-head .pack-back{background:#1e2521;border:1px solid #354039;color:#c2cabd}
html[data-theme=dark] .band-lead{color:#bfc7b9}
html[data-theme=dark] .pack-card-plus,html[data-theme=dark] .pack-tile-plus,html[data-theme=dark] .nav-plus{background:#262b28;color:#f3d27a}
html[data-theme=dark] .pack-tile.plus{background:#1e2521;border:1px dashed #49463a;color:#d3e3da}
html[data-theme=dark] .plus-crown,html[data-theme=dark] .guest-head .plus-crown{background:#262b28;color:#f3d27a}
html[data-theme=dark] .plus-perks{color:#d3e3da}
html[data-theme=dark] .plus-perks li:before{background:#30372b;color:var(--green)}
html[data-theme=dark] .plus-soon{color:#c2cabd}
html[data-theme=dark] .plus-terms{background:#171e1a;color:#c2cabd}
html[data-theme=dark] .plus-links a{color:var(--green);text-decoration:none}
html[data-theme=dark] .plus-test{color:#f2bc81;background:#151c17}
html[data-theme=dark] .plus-nowhere{border:1px solid #453e33;background:#19201c;color:#ddd5c8}
html[data-theme=dark] .plus-nowhere b{color:#ede4d7}
html[data-theme=dark] .account-confirm-loss{background:#19201c;border:1px solid #453e33;color:#ddd5c8}
html[data-theme=dark] .account-confirm-loss b{color:#ede4d7}
html[data-theme=dark][data-theme=dark] .plus-terms{background:#212a24;color:#c2cabd}
html[data-theme=dark][data-theme=dark] .plus-test{background:#3a2c18;color:#e9b56a}
html[data-theme=dark][data-theme=dark] .plus-nowhere,html[data-theme=dark][data-theme=dark] .account-confirm-loss{background:#2c2618;border-color:#c4b79a;color:#d9c9a5}
html[data-theme=dark][data-theme=dark] .plus-nowhere b,html[data-theme=dark][data-theme=dark] .account-confirm-loss b{color:#efe2c4}
html[data-theme=dark] .ad-demo h2{color:#d8e8e0}
html[data-theme=dark] .ad-demo p{color:#c2cabd;background:repeating-linear-gradient(135deg,#2f3431 0 8px,#181e1a 8px 16px)}
html[data-theme=dark] .library-local{background:#2f3431;color:#b2b9ac}
html[data-theme=dark] .sets-note-hide{color:#bfc7b9}
html[data-theme=dark] .sets-note.plus{background:linear-gradient(135deg,#2f3a33,#253029);color:#f6f1df}
html[data-theme=dark] .sets-note.plus b{color:#f3d27a}
html[data-theme=dark] .sets-note.plus .button{background:linear-gradient(#f3d27a,#d9b04f);color:#2b2a24}
html[data-theme=dark] .sets-note.plus .sets-note-hide{color:#c9cdb8}
html[data-theme=dark] .plus-prices button{border:1.5px solid #354039;color:#c2cabd;background:#1e2521}
html[data-theme=dark] .plus-prices strong{color:#d3e3da}
html[data-theme=dark] .plus-prices button[aria-checked=true]{border-color:var(--green);background:#191f1b}
html[data-theme=dark] .plus-prices i{background:var(--green);color:#10251b}
html[data-theme=dark] .nf-eyebrow{color:#c0c9bc;background:#2c342e}
html[data-theme=dark] .nf-board{background:#1e2521;border:1px solid #354039;box-shadow:0 14px 36px #0000002b}
html[data-theme=dark] .nf-board table{color:#c2c9bc}
html[data-theme=dark] .nf-board td{border:1px solid #37433b;background:#1f2621;color:#a0a699}
html[data-theme=dark] .nf-board td.on{background:#295c47}
html[data-theme=dark] .nf-title{color:#d8e8e0}
html[data-theme=dark] .nf-text{color:#c2cabd}
html[data-theme=dark] .nf-actions a{text-decoration:none}
html[data-theme=dark] .nf-actions .nf-home{background:linear-gradient(135deg,#367457,#245640);color:#ffffff}
html[data-theme=dark] .nf-actions .nf-sets{border:1px solid #354039;background:#1e2521;color:#d3e3da}
html[data-theme=dark] .today-league .today-league-head small{color:#bfc7b9}
html[data-theme=dark] .today-card-icon.league{background:#323432;color:#adb7c3}
html[data-theme=dark] .league-meta{color:#bfc7b9}
html[data-theme=dark] .league-result{background:#2c342e;color:#d3e3da}
html[data-theme=dark] .league-result[data-moved="1"]{background:#30372b;color:#b0e5ca}
html[data-theme=dark] .league-result[data-moved="-1"]{background:#2d3831;color:#ffb69d}
html[data-theme=dark] .league-board{background:#1e2521f2;border:1px solid #354039}
html[data-theme=dark] .league-player.you{background:#30372b}
html[data-theme=dark] .league-rank{color:#bfc7b9}
html[data-theme=dark] .league-avatar{color:#ffffff}
html[data-theme=dark] .league-xp{color:#c9d2c5}
html[data-theme=dark] .league-divider::before,html[data-theme=dark] .league-divider::after{background:currentColor}
html[data-theme=dark] .league-divider.up{color:#89d8a9}
html[data-theme=dark] .league-divider.down{color:#fda58c}
html[data-theme=dark] .league-empty{background:#1e2521f2;border:1px solid #354039}
html[data-theme=dark] .league-empty p{color:#d3e3da}
html[data-theme=dark] .community-search{background:#1f2621;border:1px solid #354039;color:#bfc7b9}
html[data-theme=dark] .community-search input{background:none;color:#d3e3da}
html[data-theme=dark] .community-chips button{border:1px solid #36413a;background:#1f2621;color:#c9d2c5}
html[data-theme=dark] .community-chips button[aria-pressed=true],html[data-theme=dark] .community-chips button[aria-checked=true]{background:#30453b;border-color:#a7bfb3;color:#ffffff}
html[data-theme=dark] .community-card{background:#1e2521f2;border:1px solid #354039;color:#d3e3da;text-decoration:none}
html[data-theme=dark] .community-card-meta small{color:#c2cabd}
html[data-theme=dark] .community-card-stats{color:#bfc7b9}
html[data-theme=dark] .community-board,html[data-theme=dark] .cpuzzle-board{background-color:#1d231f;background-image:linear-gradient(90deg,#303833 1px,transparent 1px),linear-gradient(#303833 1px,transparent 1px);border:1px solid #353f39}
html[data-theme=dark] .community-board.unknown::after,html[data-theme=dark] .cpuzzle-board.unknown::after{color:#a0a799}
html[data-theme=dark] .cpuzzle-number{color:#bfc7b9}
html[data-theme=dark] .cpuzzle-more{color:#d3e3da}
html[data-theme=dark] .cpuzzle-menu{background:#1e2521;border:1px solid #354039;box-shadow:0 12px 30px #00000044}
html[data-theme=dark] .cpuzzle-menu button{color:#d3e3da}
html[data-theme=dark] .cpuzzle-card{background:#1e2521;border:1px solid #354039;box-shadow:0 22px 50px #00000028}
html[data-theme=dark] .cpuzzle-board{border:2px solid #899b7d}
html[data-theme=dark] .cpuzzle-board.unknown::after{color:#b0b8ab59}
html[data-theme=dark] .cpuzzle-caption b{color:#d8e8e0}
html[data-theme=dark] .cpuzzle-caption span{color:#c2cabd}
html[data-theme=dark] .cpuzzle-author span:not(.league-avatar){color:#bfc7b9}
html[data-theme=dark] .cpuzzle-follow{border:1px solid var(--green);background:none;color:var(--green)}
html[data-theme=dark] .cpuzzle-follow[aria-pressed=true]{background:#30372b;border-color:#373d33}
html[data-theme=dark] .cpuzzle-stats{background:#1e2521f2;border:1px solid #354039}
html[data-theme=dark] .cpuzzle-stats div+div{border-left:1px solid #343d37}
html[data-theme=dark] .cpuzzle-stats span{color:#bfc7b9}
html[data-theme=dark] .cpuzzle-levels{background:#1e2521f2;border:1px solid #354039}
html[data-theme=dark] .cpuzzle-levels>div>span:first-child{color:#c2cabd}
html[data-theme=dark] .cpuzzle-levels small{color:#bfc7b9}
html[data-theme=dark] .difficulty-tier.players i.on{background:#c98a2e}
html[data-theme=dark] .cpuzzle-limit{background:#151c17;color:#f2ca99}
html[data-theme=dark] .cpuzzle-like{border:1px solid #37433b;background:#1e2520;color:#faa18d}
html[data-theme=dark] .cpuzzle-like[aria-pressed=true] svg{fill:currentColor}
html[data-theme=dark] .publish-picture{background:#1e2521;border:1px solid #354039}
html[data-theme=dark] .publish-field>span{color:#bfc7b9}
html[data-theme=dark] .publish-field input{border:1px solid #37433b;background:#1f2621;color:#d3e3da}
html[data-theme=dark] .publish-field small{color:#bfc7b9}
html[data-theme=dark] .publish-checks{background:#1e2521f2;border:1px solid #354039}
html[data-theme=dark] .publish-check+.publish-check{border-top:1px solid #343d37}
html[data-theme=dark] .publish-check>span{background:#2d342f;color:#bfc7b9}
html[data-theme=dark] .publish-check.ok>span{background:#30372b;color:#ace2c9}
html[data-theme=dark] .publish-check.bad>span{background:#2d3831;color:#fda58c}
html[data-theme=dark] .publish-check small{color:#bfc7b9}
html[data-theme=dark] .publish-mine{background:#151c17;color:#f2ca99}
html[data-theme=dark] .publish-mine input{accent-color:#a8641a}
html[data-theme=dark] .publish-note{color:#bfc7b9}
html[data-theme=dark] .draw-publish{border:1px solid var(--green);color:var(--green);background:none}
html[data-theme=dark] .community-pick{background:#2f3431;border:1px solid #36423a;color:#d5e1ed}
html[data-theme=dark] .community-pick-art i{background:#364756}
html[data-theme=dark] .community-pick-art i:nth-child(1),html[data-theme=dark] .community-pick-art i:nth-child(4){background:#4d7ea8}
html[data-theme=dark] .community-pick-text small{color:#90c3f0}
html[data-theme=dark] .community-pick-text span{color:#bac6d1}
html[data-theme=dark] .today-podium{background:#1f262117}
html[data-theme=dark] .today-podium-row b{color:#d8e8e0;background:#1f2621d9}
html[data-theme=dark] .today-podium-row:nth-child(1) b{background:#473c1d}
html[data-theme=dark] .today-podium-row:nth-child(2) b{background:#343b36}
html[data-theme=dark] .today-podium-row:nth-child(3) b{background:#593f29}
html[data-theme=dark] .today-podium-row.you:not(:nth-child(-n+3)){border-top:1px dashed #3535354d}
html[data-theme=dark] .today-podium-row.you:not(:nth-child(-n+3)) b{background:#1f2621}
html[data-theme=dark] .community-card-author{color:#c2cabd}
html[data-theme=dark] .community-card-stats span:last-child{color:#c2cabd}
html[data-theme=dark] .cpuzzle-rank{background:#1e2521f2;border:1px solid #354039}
html[data-theme=dark] .cpuzzle-rank-head small{color:#bfc7b9}
html[data-theme=dark] .cpuzzle-rank-row{border-bottom:1px solid #353b37}
html[data-theme=dark] .cpuzzle-rank-row b{background:#2d342f}
html[data-theme=dark] .cpuzzle-rank-row:nth-child(1) b{background:#473c1d}
html[data-theme=dark] .cpuzzle-rank-row:nth-child(2) b{background:#343b36}
html[data-theme=dark] .cpuzzle-rank-row:nth-child(3) b{background:#593f29}
html[data-theme=dark] .cpuzzle-rank-row.you{background:#161d18}
html[data-theme=dark] .cpuzzle-rank-gap{color:#989e91}
html[data-theme=dark] .cpuzzle-rank-note{color:#c2cabd}
html[data-theme=dark] .community-publish{border:1.5px dashed #43493e;background:#1e2521;color:#d3e3da}
html[data-theme=dark] .community-publish:hover{border-color:#89bda5}
html[data-theme=dark] .community-publish-icon{background:#295c47;color:#ffffff}
html[data-theme=dark] .community-publish-text small{color:#c2cabd}
html[data-theme=dark] .publish-source-label{color:#c0c9bc}
html[data-theme=dark] .publish-plus{background:#253d33;color:#ffffff}
html[data-theme=dark] .publish-plus .button{background:#473c1d;color:#d8e8e0}
html[data-theme=dark] .streak-sets{color:var(--green)}
html[data-theme=dark] .league-rules{border:1.5px dashed #37433b;color:#c2cabd}
html[data-theme=dark] .league-rules>b{color:#d3e3da}
html[data-theme=dark] .league-rules li b{color:#d3e3da}
html[data-theme=dark] .daily-shareblock{background:#1e2521f2;border:1px solid #354039}
html[data-theme=dark] .daily-share-image{box-shadow:0 10px 26px #0000005c}
html[data-theme=dark] .daily-share-eyebrow{color:#c0c9bc}
html[data-theme=dark] .daily-share-title{color:#d8e8e0}
html[data-theme=dark] .daily-share-facts{color:#c8d6cd}
html[data-theme=dark] .daily-share-facts i{background:#2c342e;color:var(--green)}
html[data-theme=dark] .daily-share-text .daily-share{color:#ffffff}
html[data-theme=dark] .daily-next{background:#1e2521f2;border:1px solid #354039;color:#c8d6cd}
html[data-theme=dark] .daily-panel{background:#1e2521f2;border:1px solid #354039}
html[data-theme=dark] .daily-panel>b{color:#c0c9bc}
html[data-theme=dark] .daily-spread-bars i{background:#2e3a32}
html[data-theme=dark] .daily-spread-bars i.you{background:var(--green)}
html[data-theme=dark] .daily-spread-labels{color:#bfc7b9}
html[data-theme=dark] .daily-spread-labels span:nth-child(2){color:var(--green)}
html[data-theme=dark] .daily-mine-stats strong{color:#d8e8e0}
html[data-theme=dark] .daily-mine-stats span{color:#c2cabd}
html[data-theme=dark] .today-league-chip{background:var(--green);color:#10251b}
html[data-theme=dark] .today-league-bar,html[data-theme=dark] .league-week-bar{background:#2f3431}
html[data-theme=dark] .today-league-bar i,html[data-theme=dark] .league-week-bar i{background:#b07a50}
html[data-theme=dark] .league-shield svg{filter:drop-shadow(0 6px 10px #00000044)}
html[data-theme=dark] .league-week{background:linear-gradient(135deg,#3e3327,#4a3826);border:1px solid #4b4238;color:#eddfd5}
html[data-theme=dark] .league-week[data-tier="1"]{background:linear-gradient(135deg,#171d19,#343835);border-color:#3c433f;color:#d4deeb}
html[data-theme=dark] .league-week[data-tier="2"]{background:linear-gradient(135deg,#151b17,#423818);border-color:#464337;color:#f0ddae}
html[data-theme=dark] .league-week[data-tier="3"]{background:linear-gradient(135deg,#2b352f,#2a4133);border-color:#3c4840;color:#b9eaca}
html[data-theme=dark] .league-week[data-tier="4"]{background:linear-gradient(135deg,#2b362f,#40384f);border-color:#47444f;color:#e4d8ff}
html[data-theme=dark] .league-week .league-week-bar{background:#1f26218c}
html[data-theme=dark] .league-week-actions .button.secondary{background:#1e2521}
html[data-theme=dark] .league-panel{background:#1e2521f2;border:1px solid #354039}
html[data-theme=dark] .league-panel>b{color:#c0c9bc}
html[data-theme=dark] .league-panel>small{color:#bfc7b9}
html[data-theme=dark] .league-ladder li{color:#c2cabd}
html[data-theme=dark] .league-ladder li small{color:#bfc7b9}
html[data-theme=dark] .league-ladder li.here{background:#2e3530;color:#d3e3da}
html[data-theme=dark] .league-ladder li.here small{color:#f2c095}
html[data-theme=dark] .league-xp td{border-bottom:1px solid #353b37}
html[data-theme=dark] .action-dock .dock-share{color:var(--green)}
html[data-theme=dark] .hint-track>i{background:#1e2521;border:1px solid #39453d}
html[data-theme=dark] .hint-track>i.known{background:#7d9a86;border-color:#7c9985}
html[data-theme=dark] .hint-track>i.cross{background:#2f3431}
html[data-theme=dark] .hint-track>i.lit{background:repeating-linear-gradient(135deg,#9fc08a 0 3px,#30372b 3px 6px);box-shadow:inset 0 0 0 2px #72a68f}
html[data-theme=dark] .hint-track>i.lit-cross{background:#161c18;box-shadow:inset 0 0 0 2px #a5ae9a}
html[data-theme=dark] .hint-bar{color:#ffffff}
html[data-theme=dark] .hint-bar.left{background:#5b7fa3d9}
html[data-theme=dark] .hint-bar.right{background:#c98a2ed9}
html[data-theme=dark] .hint-play{background:var(--green);color:#10251b}
html[data-theme=dark] .hint-play-icon{background:#1f262126}
html[data-theme=dark] .hint-play-icon.play:before{border-left:9px solid #353535;border-top:6px solid transparent;border-bottom:6px solid transparent}
html[data-theme=dark] .hint-play-icon.pause:before,html[data-theme=dark] .hint-play-icon.pause:after{background:#1f2621}
html[data-theme=dark] .hint-step{border:1px solid #37433b;background:#1e2521;color:#c2cabd}
html[data-theme=dark] .hint-step b{background:#2f3431;color:#c2cabd}
html[data-theme=dark] .hint-step:hover{border-color:#6e8c5e}
html[data-theme=dark] .hint-step.done{color:#d3e3da}
html[data-theme=dark] .hint-step.done b{background:#34402e;color:#b0e5ca}
html[data-theme=dark] .hint-step.current{border-color:var(--green);background:#161d18;color:#b0e5ca}
html[data-theme=dark] .hint-step.current b{background:var(--green);color:#10251b}
html[data-theme=dark] .hint-step-text{color:#c8d6cd}
html[data-theme=dark] .hint-left{background:#e0a72e;color:#ffffff}
html[data-theme=dark] .board td.cell.hp-left{box-shadow:inset 0 0 0 999px #5b7fa333}
html[data-theme=dark] .board td.cell.hp-right{box-shadow:inset 0 0 0 999px #c98a2e33}
html[data-theme=dark] .board td.cell.hp-left.hp-right{box-shadow:inset 0 0 0 999px #5f8a5a4d}
html[data-theme=dark] .board td.cell.hp-layout{box-shadow:inset 0 0 0 999px #7a6aa340}
html[data-theme=dark] .board td.cell.hp-assume{box-shadow:inset 0 0 0 3px #c98a2e,inset 0 0 0 999px #554b3b}
html[data-theme=dark] .board td.cell.hp-conflict{box-shadow:inset 0 0 0 999px #45534a}
html[data-theme=dark] .board td.cell.hp-conflict.hp-assume{box-shadow:inset 0 0 0 3px #b4493c,inset 0 0 0 999px #45534a}
html[data-theme=dark] .hint-bar.layout{background:#7a6aa3d9}
html[data-theme=dark] .settings-row-note{color:#bfc7b9}
html[data-theme=dark] .community-howto{border:1.5px dashed #3f4539;background:#1e2521b3}
html[data-theme=dark] .community-howto li>span{background:#30372b;color:var(--green)}
html[data-theme=dark] .community-howto li small{color:#c2cabd}
html[data-theme=dark] .publish-steps li{border-top:3px solid #343f38;color:#bfc7b9}
html[data-theme=dark] .publish-steps li b{background:#2f3431}
html[data-theme=dark] .publish-steps li.current{border-color:var(--green);color:var(--green)}
html[data-theme=dark] .publish-steps li.current b{background:var(--green);color:#10251b}
html[data-theme=dark] .publish-steps li.done{border-color:#6e8c5e;color:#d3e3da}
html[data-theme=dark] .publish-steps li.done b{background:#34402e;color:#b0e5ca}
html[data-theme=dark] .publish-steps li.bad{border-color:#a97467;color:#ffa698}
html[data-theme=dark] .publish-steps li.bad b{background:#2d3831;color:#ffa698}
html[data-theme=dark] .publish-source-tag{color:#bfc7b9}
html[data-theme=dark] .publish-source-tag[data-status=unique]{color:var(--green)}
html[data-theme=dark] .publish-source-tag[data-status=multiple],html[data-theme=dark] .publish-source-tag[data-status=unsatisfiable]{color:#f1ae72}
html[data-theme=dark] .board.hp-stepping td.cell.hp-left,html[data-theme=dark] .board.hp-stepping td.cell.hp-right{box-shadow:none}
html[data-theme=dark] .board.hp-stepping td.cell.hp-left:before{background:#5b7fa3}
html[data-theme=dark] .board.hp-stepping td.cell.hp-right:after{background:#c98a2e}
html[data-theme=dark] .board.hp-stepping td.cell[data-hp].hp-left:before{color:#ffffff}
html[data-theme=dark] .board.hp-stepping td.cell[data-hp].hp-right:after{color:#ffffff}
html[data-theme=dark] .board.hp-stepping td.cell button.suggest-fill:not(.filled),html[data-theme=dark] .board.hp-stepping td.cell button.suggest-cross:not(.filled){background:none}
html[data-theme=dark] .board.hp-stepping td.cell.hp-overlap button.suggest-fill:not(.filled){box-shadow:inset 0 0 0 2px #72a68f}
html[data-theme=dark] .lang-switch{background:#171e1a}
html[data-theme=dark] .lang-switch button{color:#c2cabd}
html[data-theme=dark] .lang-switch button[aria-pressed="true"]{background:#1f2621;color:var(--green);box-shadow:0 1px 4px #00000024}
html[data-theme=dark] .clue-meter i{background:#2f3832}
html[data-theme=dark] .clue-meter i.fill{background:var(--green)}
html[data-theme=dark] .clue-meter i.unknown{background:repeating-linear-gradient(45deg,#94a682 0 2px,#2f3832 2px 4px)}
html[data-theme=dark] .clue-meter i.over{background:#b4493c}
html[data-theme=dark] #clue-input.invalid{border-color:#eb7a6a;background:#1a211c}
html[data-theme=dark] #clue-error{color:#ffa698}
html[data-theme=dark] .coach-meter{background:#2f3832}
html[data-theme=dark] .coach-meter i{background:var(--green)}
html[data-theme=dark] .publish-source-lead{color:#c8d6cd}
html[data-theme=dark] .today-pack.locked{background:#2f3431;color:#c2cabd}
html[data-theme=dark] .today-pack.locked strong{color:#d3e3da}
html[data-theme=dark] .league-sample{background:#171e1a}
html[data-theme=dark] .league-sample-label{color:#c0c9bc}
html[data-theme=dark] .league-sample-row{background:#1e2521}
html[data-theme=dark] .league-sample-row b{color:#bfc7b9}
html[data-theme=dark] .league-sample-row em{color:#d3e3da}
html[data-theme=dark] .league-sample-row.up{box-shadow:inset 3px 0 0 #6aa36f}
html[data-theme=dark] .league-sample-row.down{box-shadow:inset 3px 0 0 #d08a7e}
html[data-theme=dark] .nav-lang{background:#2c342e;color:var(--green)}
html[data-theme=dark] .lang-menu .lang-menu-item small{color:#bfc7b9}
html[data-theme=dark] .lang-menu .lang-menu-item[aria-checked=true]{background:#2c342e;color:var(--green)}
html[data-theme=dark] .lang-menu-note{color:#bfc7b9}
html[data-theme=dark] .user-menu-lang{color:#d3e3da}
html[data-theme=dark] .today-goal{background:#1e2521f2}
html[data-theme=dark] .today-goal-head{color:inherit;text-decoration:none}
html[data-theme=dark] .today-goal-head:after{border-radius:inherit}
html[data-theme=dark] .today-goal-head:focus-visible{outline:none}
html[data-theme=dark] .today-goal:has(.today-goal-head:focus-visible){outline:2px solid var(--green)}
html[data-theme=dark] .today-goal-flame svg{fill:#d89e5a}
html[data-theme=dark] .today-goal.cold .today-goal-flame svg{fill:#d9dccf}
html[data-theme=dark] .today-goal-foot{border-top:1px solid #343d37;color:#c2cabd}
html[data-theme=dark] .today-goal-freezes{color:#90c3f0}
html[data-theme=dark] .today-revive{background:#1c231e;border:1px solid #423c31;color:#f0e5d9}
html[data-theme=dark] .today-revive-eyebrow{color:#e6a766}
html[data-theme=dark] .today-revive small{color:#cec3b8}
html[data-theme=dark] .today-revive-bar{background:#3b3428}
html[data-theme=dark] .today-revive-bar i{border-radius:inherit;background:#d08a2e}
html[data-theme=dark] .today-revive .today-revive-left{color:#bdb3a7}
html[data-theme=dark] .today-revive-daily{color:var(--green)}
html[data-theme=dark] .goal-day.met.revived i{background:#151c17;box-shadow:inset 0 0 0 2px #64563f}
html[data-theme=dark] .streak.party{background:radial-gradient(circle at 50% 28%,#1a211c,#2c3730 72%)}
html[data-theme=dark] .streak.party .streak-flame b{background:none;box-shadow:none;color:#e2a463}
html[data-theme=dark] .streak-milestone{background:#1f2621;border:1px solid #423c31}
html[data-theme=dark] .streak-milestone small{color:#cec3b8}
html[data-theme=dark] .streak-track span{color:#b1a99d;background:#2d3530}
html[data-theme=dark] .streak-track span.got{color:#f1ae72;background:#151c17}
html[data-theme=dark] .streak-track span.now{color:#f1ae72;background:#1f2621;box-shadow:inset 0 0 0 2px #d08a2e}
html[data-theme=dark] #streak-share{background:none}
html[data-theme=dark] .settings-row input.settings-time{border:1px solid #37423b;background:#1e2521;color:#d3e3da}
html[data-theme=dark] .play-title .play-saved{color:#a6c397}
@media(min-width:1100px){
html[data-theme=dark] .puzzle.playing .play-title .play-saved{color:#c0c9bc}
html[data-theme=dark] .puzzle.playing .play-saved:before{color:#bfc7b9}
}
html[data-theme=dark] .friends-card{background:#1e2521f2;border:1px solid #354039}
html[data-theme=dark] .friends-invite-text small,html[data-theme=dark] .friends-quest>small{color:#bfc7b9}
html[data-theme=dark] .friends-brow{color:#bfc7b9}
html[data-theme=dark] .friends-bar{background:#2e3731}
html[data-theme=dark] .friends-bar i{background:var(--green)}
html[data-theme=dark] .friend-row+.friend-row{border-top:1px solid #343d37}
html[data-theme=dark] .friend-avatar{color:#ffffff}
html[data-theme=dark] .friend-text small{color:#bfc7b9}
html[data-theme=dark] .friend-nudge{color:var(--green)}
html[data-theme=dark] .friend-nudged{color:#bfc7b9}
html[data-theme=dark] .friend-streak.cold{background:#2e3430;color:#bfc7b9}
html[data-theme=dark] .friend-actions small{color:#c2cabd}
html[data-theme=dark] .friend-remove{color:#ffab9d}
html[data-theme=dark] .friend-remove.confirm{background:#2e3832;color:#ffc4b5}
html[data-theme=dark] .friends-empty small{color:#bfc7b9}
html[data-theme=dark] .friends-add-row input{border:1px solid #37433b;background:#1f2621;color:#d3e3da}
html[data-theme=dark] .friends-add-row input[aria-invalid]{border-color:#b6796f;background:#1a211c}
html[data-theme=dark] .friends-error{background:#2e3832;color:#ffc4b5}
html[data-theme=dark] .friends-name-row{border-top:1px solid #343d37}
html[data-theme=dark] .friends-name-form{border-top:1px solid #343d37}
html[data-theme=dark] .friends-privacy{color:#bfc7b9}
html[data-theme=dark] .friends-guest-icon{background:#30372b;color:var(--green)}
html[data-theme=dark] .friends-guest p{color:#c2cabd}
html[data-theme=dark] .account-friends{background:#1e2521f2;border:1px solid #354039}
html[data-theme=dark] .account-friends-icon{background:#30372b;color:var(--green)}
html[data-theme=dark] .account-friends-text small{color:#bfc7b9}
html[data-theme=dark] .account-friends-go{color:#a2a89b}
html[data-theme=dark] .daily-row span small{color:#bfc7b9}
html[data-theme=dark] .today-started-head{color:#c0c9bc}
html[data-theme=dark] .today-started-thumb{background:#1f2621;border:1px solid #354039}
html[data-theme=dark] .today-started-eyebrow{color:#c0c9bc}
html[data-theme=dark] .today-started-item:not(.first) .today-started-eyebrow{color:#bfc7b9}
html[data-theme=dark] .today-started-go{background:linear-gradient(135deg,#367457 0%,#245640 100%);color:#ffffff;box-shadow:0 6px 14px #0000005c}
html[data-theme=dark] .today-started-pill{background:#2c342e;color:var(--green)}
html[data-theme=dark] .pack-tile-started{color:var(--green)}
html[data-theme=dark] .pack-tile-bar{background:#2e3731}
html[data-theme=dark] .pack-tile-bar i{background:var(--green)}
html[data-theme=dark] .play-credit{color:#c9d2c5;background:radial-gradient(circle,#2d342f 0 15px,transparent 15.5px)}
html[data-theme=dark] .credit-sheet h2{color:#d8e8e0}
html[data-theme=dark] .credit-sheet p{color:#c2cabd}
html[data-theme=dark] .credit-line{color:#c2cabd}
html[data-theme=dark] .credit-summary{color:inherit}
html[data-theme=dark] .credit-license{color:#c9d2c5}
html[data-theme=dark] .credit-more{background:#1e2521;border:1px solid #354039;color:#c2cabd}
html[data-theme=dark] .credit-more p:first-child{color:#d3e3da}
html[data-theme=dark] .credit-more a{color:var(--green)}
html[data-theme=dark] .pack-credits{color:inherit}
html[data-theme=dark] .credits-note{color:#c2cabd}
html[data-theme=dark] .credits-list{background:#1e2521f2;border:1px solid #354039}
html[data-theme=dark] .credits-row+.credits-row{border-top:1px solid #343d37}
html[data-theme=dark] .credits-thumb{background:#2f3431;color:#a0a799}
html[data-theme=dark] .credits-head{color:inherit}
html[data-theme=dark] .credits-text strong{color:#d3e3da}
html[data-theme=dark] .credits-text small{color:#c2cabd}
html[data-theme=dark] .credits-head .credit-chevron{color:#bfc7b9}
html[data-theme=dark] .credits-closed{color:#bfc7b9}
html[data-theme=dark] .credits-all{color:var(--green)}
html[data-theme=dark] .board th .clue-button>span.struck{color:#9da497}
html[data-theme=dark] .clue-button>span.struck:after,html[data-theme=dark] .clue-button>span.strike-gone:after{background:linear-gradient(to top right,transparent calc(50% - 1px),#60706080 calc(50% - 1px),#60706080 calc(50% + 1px),transparent calc(50% + 1px))}
html[data-theme=dark] .board th.hint-line .clue-button>span.struck{color:#ffffffa6}
html[data-theme=dark] .board th.hint-line .clue-button>span.struck:after{background:linear-gradient(to top right,transparent calc(50% - 1px),#1f2621a6 calc(50% - 1px),#1f2621a6 calc(50% + 1px),transparent calc(50% + 1px))}
html[data-theme=dark] .board th .clue-button.clue-error{color:#fca292}
html[data-theme=dark] .board th.row-clue .clue-button.clue-error{background:#2d3730}
html[data-theme=dark] .board th.col-clue .clue-button.clue-error:before{background:#2d3730}
html[data-theme=dark] .board td.cell button.empty.auto-cross{color:#c7cebd;background:#1b221d}
html[data-theme=dark] .settings-list>.settings-toggle{border-top:1px solid #363c38}
html[data-theme=dark] .settings-list>.settings-toggle>span:first-child{color:#b0b7aa}
html[data-theme=dark] .settings-list>.settings-toggle input{accent-color:var(--green)}
html[data-theme=dark] .settings-strike-icon:after{background:linear-gradient(to top right,transparent calc(50% - 1px),currentColor calc(50% - 1px),currentColor calc(50% + 1px),transparent calc(50% + 1px))}
html[data-theme=dark] .warmup-steps i{background:#2e3731}
html[data-theme=dark] .warmup-steps i.done{background:var(--green)}
html[data-theme=dark] .warmup-steps i.now{background:#9db58d}
html[data-theme=dark] .warmup-meta{color:#c2cabd}
html[data-theme=dark] .warmup-picture{background:#1e2521;border:1px solid #354039;box-shadow:0 8px 20px #00000024}
html[data-theme=dark] .warmup-card{background:#1e2521f2;border:1px solid #354039}
html[data-theme=dark] .warmup-card small{color:#c2cabd}
html[data-theme=dark] .warmup-flame svg{fill:#d89e5a}
html[data-theme=dark] .pack-tile-trial{background:#2e3430;color:#c1c9bc}
@media(hover:hover) and (pointer:fine){
html[data-theme=dark] .dock-key{background:#1f2621;border:1px solid #39413c;color:#c2cabd}
}
html[data-theme=dark] .paint-tools button.held{color:var(--green);box-shadow:0 1px 4px #00000024,0 0 0 2px #72a68f66}
html[data-theme=dark] .press-ring circle{fill:#ace2c914;stroke:var(--green)}
html[data-theme=dark] .stroke-badge{background:#253d33;color:#ffffff;box-shadow:0 6px 14px #0000005c}
html[data-theme=dark] .stroke-badge:after{border:5px solid transparent}
html[data-theme=dark] .stroke-badge[data-side=top]:after{border-top-color:#a9c5b8}
html[data-theme=dark] .stroke-badge[data-side=bottom]:after{border-bottom-color:#a9c5b8}
html[data-theme=dark] .stroke-badge[data-side=left]:after{border-left-color:#a9c5b8}
html[data-theme=dark] .stroke-badge[data-side=right]:after{border-right-color:#a9c5b8}
html[data-theme=dark] .board td.cell.hl button:not(.filled):not(.empty){background:#151c17}
html[data-theme=dark] .board td.cell.hl button.empty{background:#2d3530}
html[data-theme=dark] .board th.row-clue.hl:not(.focus-axis,.correction-axis,.hint-line) .clue-button:not(.clue-error){background:#2d3630;color:var(--green)}
html[data-theme=dark] .board th.col-clue.hl:not(.focus-axis,.correction-axis,.hint-line) .clue-button:not(.clue-error){color:var(--green)}
html[data-theme=dark] .board th.col-clue.hl:not(.focus-axis,.correction-axis,.hint-line) .clue-button:not(.clue-error):before{background:#2d3630}
html[data-theme=dark] .board th.hl .clue-button>span.struck{color:#9da497}
html[data-theme=dark] .board td.cell button.kb-cursor{box-shadow:inset 0 0 0 2.5px #e0a72e}
html[data-theme=dark] .mark-switch{background:#1e2521;border:1px solid #354039;box-shadow:0 8px 20px #00000056;color:#9da396}
html[data-theme=dark] .mark-switch-cell{background:currentColor}
html[data-theme=dark] .mark-switch-arrow{color:#9da396}
html[data-theme=dark] .mark-switch[data-mode="1"] .mark-switch-cell,html[data-theme=dark] .mark-switch[data-mode="-1"] .mark-switch-cross{color:var(--green)}
html[data-theme=dark] .mark-switch[data-mode="1"] .mark-switch-cell{background:var(--green)}
html[data-theme=dark] .settings-keys-list{color:#c2cabd}
html[data-theme=dark] .settings-keys-list kbd{background:#1f2621;border:1px solid #39413c;box-shadow:0 1px 0 #00000099;color:#c9d2c5}
html[data-theme=dark] .learn-note{color:#c2cabd}
html[data-theme=dark] .learn-progress>span{background:#2f3832}
html[data-theme=dark] .learn-progress i{border-radius:inherit;background:#9db58d}
html[data-theme=dark] .learn-progress b{color:#c2cabd}
html[data-theme=dark] .learn-list{background:#1e2521f2;border:1px solid #354039}
html[data-theme=dark] .learn-row{color:#d3e3da}
html[data-theme=dark] .learn-row+.learn-row{border-top:1px solid #343d37}
html[data-theme=dark] .learn-mark{background:#2f3431;color:#a0a799}
html[data-theme=dark] .learn-row.done .learn-mark{background:var(--green);color:#10251b}
html[data-theme=dark] .learn-row.next .learn-mark{background:#30372b;color:var(--green);box-shadow:inset 0 0 0 2px var(--green)}
html[data-theme=dark] .learn-text small{color:#c2cabd}
html[data-theme=dark] .learn-row.locked .learn-text strong{color:#bfc7b9}
html[data-theme=dark] .learn-card{background:#1e2521f2;border:1px solid #354039;color:#d3e3da}
html[data-theme=dark] .learn-card-icon{background:#30372b;color:var(--green)}
html[data-theme=dark] .learn-card-text small{color:#c2cabd}
html[data-theme=dark] .learn-card-go{color:#bfc7b9}
html[data-theme=dark] .lesson-bar{background:#1e2521eb;border:1px solid #354039}
html[data-theme=dark] .lesson-close{color:#d3e3da}
html[data-theme=dark] .lesson-head small{color:#bfc7b9}
html[data-theme=dark] .lesson-steps i{background:#2f3832}
html[data-theme=dark] .lesson-steps i.done{background:var(--green)}
html[data-theme=dark] .lesson-steps i.now{background:#9db58d}
html[data-theme=dark] .lesson-text{background:#1e2521f2;border:1px solid #354039;color:#d3e3da}
html[data-theme=dark] .lesson-table th{color:#c9d2c5}
html[data-theme=dark] .lesson-table td.lesson-split{border-right:2px solid #838e79}
html[data-theme=dark] .lesson-cell{border:1px solid #3f4438;background:#1e2521}
html[data-theme=dark] .lesson-cell.filled{background:var(--green);border-color:var(--green)}
html[data-theme=dark] .lesson-cell.crossed:before,html[data-theme=dark] .lesson-cell.crossed:after{background:#8a9680}
html[data-theme=dark] .lesson-cell.given.filled{background:#4f7a62}
html[data-theme=dark] .lesson-cell.focus{box-shadow:inset 0 0 0 3px #d3ad54}
html[data-theme=dark] .lesson-cell.wrong{box-shadow:inset 0 0 0 3px #c0503f}
html[data-theme=dark] .lesson-legend{color:#bfc7b9}
html[data-theme=dark] .lesson-feedback.right,html[data-theme=dark] .lesson-feedback.passed{background:#30372b;border:1px solid #3c4237;color:#b2e1c7}
html[data-theme=dark] .lesson-feedback.wrong,html[data-theme=dark] .lesson-feedback.missing{background:#161c18;border:1px solid #443f34;color:#dfbc84}
html[data-theme=dark] .lesson-list-link{color:var(--green)}
html[data-theme=dark] .hint-lesson{color:var(--green)}
html[data-theme=dark] .scanner-processing{color:#c1c9bd}
html[data-theme=dark] .board td.cell button.filled.guess,html[data-theme=dark] .board td.cell button.filled.guess:hover:enabled{background:repeating-linear-gradient(45deg,#3f6b4f 0 1.6px,#303732 1.6px 4px)}
html[data-theme=dark] .board td.cell button.empty.guess{background:#151c17;color:#9bceae}
html[data-theme=dark] .guess-bar{background:#151c17;border:1px dashed #7a9a86;color:#d3e3da}
html[data-theme=dark] .guess-swatch{background:repeating-linear-gradient(45deg,#3f6b4f 0 1.6px,#303732 1.6px 4px);box-shadow:inset 0 0 0 1px #88b79840}
html[data-theme=dark] .guess-text small{color:#c1c9bc}
html[data-theme=dark] .guess-act{color:var(--green);background:#1e2521;border:1px solid #37433b}
html[data-theme=dark] .guess-act.primary{color:#10251b;background:var(--green);border-color:var(--green)}
html[data-theme=dark] .guess-bar.conflict{background:#161d18;border:1px solid #4a3d3a}
html[data-theme=dark] .guess-bar.conflict .guess-swatch{background:#c0503f;box-shadow:none}
html[data-theme=dark] .guess-bar.conflict .guess-swatch:before{color:#ffffff}
html[data-theme=dark] .guess-bar.conflict .guess-text{color:#ffb3a5}
html[data-theme=dark] .guess-toggle.active{color:var(--green);background:#2c342f;box-shadow:inset 0 0 0 1px #505b47}
html[data-theme=dark] .play-mini{color:#a9d8b8}
html[data-theme=dark] .play-mini canvas{background:#1e2521;box-shadow:0 0 0 1px #555b4c}
html[data-theme=dark] .play-mini.big canvas{box-shadow:0 0 0 .4px #555b4c,0 4px 10px #00000044}
html[data-theme=dark] .settings-mini-icon i{background:currentColor}
html[data-theme=dark] .daily-month{background:#1e2521f2;border:1px solid #354039}
html[data-theme=dark] .daily-month-heading b{color:#d8e8e0}
html[data-theme=dark] .daily-month-heading small{color:#c2cabd}
html[data-theme=dark] .daily-month-step{color:#c2cabd}
html[data-theme=dark] .daily-month-step:hover{background:#161d19}
html[data-theme=dark] .daily-month-weekday{color:#c2cabd}
html[data-theme=dark] .daily-month-day{background:#2f3431;color:#ccd4c7}
html[data-theme=dark] button.daily-month-day:focus-visible{outline:2px solid var(--green)}
html[data-theme=dark] .daily-month-day.ok{background:var(--green);color:#10251b}
html[data-theme=dark] .daily-month-day.late{background:#3e4831;color:#d8e7dd}
html[data-theme=dark] .daily-month-day.part{background:conic-gradient(#7f9670 var(--p,30%),#313a34 0)}
html[data-theme=dark] .daily-month-day.part:before{background:#1e2521}
html[data-theme=dark] .daily-month-day.today{box-shadow:0 0 0 2px #454947,0 0 0 4px #d39a24}
html[data-theme=dark] .daily-month-day.locked{background:#161c18;color:#bac1b4}
html[data-theme=dark] .daily-month-day.idle{background:none;color:#bec5b8}
html[data-theme=dark] .daily-month-picture{background:var(--paper,#2c342f);box-shadow:inset 0 0 0 1px #2222220d}
html[data-theme=dark] .daily-month-picture i.closed{background:#313733}
html[data-theme=dark] .daily-month-art-text b{color:#d8e8e0}
html[data-theme=dark] .daily-month-art-text small{color:#c2cabd}
html[data-theme=dark] .daily-month-legend{color:#c2cabd}
html[data-theme=dark] .daily-month-legend .ok:before{background:var(--green)}
html[data-theme=dark] .daily-month-legend .late:before{background:#3e4831}
html[data-theme=dark] .daily-month-legend .part:before{border:2px solid #849b74;border-right-color:#354139}
html[data-theme=dark] .daily-month-legend .locked:before{background:#161c18;border:1px solid #38443c}
html[data-theme=dark] .daily-archive-plus{background:#1e2521f2;border:1px solid #354039}
html[data-theme=dark] .daily-archive-plus-text b{color:#d8e8e0}
html[data-theme=dark] .daily-archive-plus-text small{color:#c2cabd}
html[data-theme=dark] .account-trophy{background:#1e2521f2;border:1px solid #354039;color:inherit;text-decoration:none}
html[data-theme=dark] .account-trophy-text b{color:#d8e8e0}
html[data-theme=dark] .account-trophy-text small{color:#c2cabd}
html[data-theme=dark] .stats-tile{background:#1e2521f2;border:1px solid #354039}
html[data-theme=dark] .stats-tile b{color:#d8e8e0}
html[data-theme=dark] .stats-tile b.hot{color:#f1ae72}
html[data-theme=dark] .stats-tile b svg{fill:#d89e5a}
html[data-theme=dark] .stats-tile small{color:#c2cabd}
html[data-theme=dark] .stats-card{background:#1e2521f2;border:1px solid #354039}
html[data-theme=dark] .stats-card>b,html[data-theme=dark] .stats-times-head b{color:#d8e8e0}
html[data-theme=dark] .stats-bars i{background:#2e3a32}
html[data-theme=dark] .stats-bars i.you{background:var(--green)}
html[data-theme=dark] .stats-labels span{color:#c2cabd}
html[data-theme=dark] .stats-labels span.you{color:var(--green)}
html[data-theme=dark] .stats-note{color:#c8d6cd}
html[data-theme=dark] .stats-daily-facts strong{color:#d8e8e0}
html[data-theme=dark] .stats-daily-facts span{color:#c2cabd}
html[data-theme=dark] .today-quests{background:#1e2521f2;border:1px solid #354039;color:#d3e3da}
html[data-theme=dark] .today-quests-bar{color:inherit}
html[data-theme=dark] .today-quests-eyebrow{color:#bfc7b9}
html[data-theme=dark] .today-quests-dots i{background:#2f3832}
html[data-theme=dark] .today-quests-dots i.on{background:var(--green)}
html[data-theme=dark] .today-quests-count{color:#c2cabd}
html[data-theme=dark] .today-quests-count.boost{background:#413516;color:#f3cd94}
html[data-theme=dark] .today-quests-chevron{color:#bfc7b9}
html[data-theme=dark] .today-quests-body{border-top:1px solid #343d37}
html[data-theme=dark] .quest+.quest{border-top:1px solid #343d37}
html[data-theme=dark] .quest-icon{background:#171e1a;color:var(--green)}
html[data-theme=dark] .quest-icon svg{fill:#d89e5a}
html[data-theme=dark] .quest.done .quest-icon{background:#30372b}
html[data-theme=dark] .quest.done .quest-text b{color:#c2cabd}
html[data-theme=dark] .quest-bar{background:#2e3631}
html[data-theme=dark] .quest-bar i{border-radius:inherit;background:var(--green)}
html[data-theme=dark] .quest.week .quest-bar i{background:#d08a2e}
html[data-theme=dark] .quest-reward{color:#efbd7a}
html[data-theme=dark] .quest.done .quest-reward{color:#bfc7b9}
html[data-theme=dark] .today-quests-foot{color:#c2cabd}
html[data-theme=dark] .today-quests-week{border-top:1px solid #343d37}
html[data-theme=dark] .today-quests-head small{color:#c2cabd}
html[data-theme=dark] .nav-boost{background:#413516;color:#f3cd94}
html[data-theme=dark][data-board] .board-sheet{background:var(--board-sheet)}
html[data-theme=dark][data-board] .board .cell{background:var(--board-paper);border-color:var(--board-line)}
html[data-theme=dark][data-board] .board .cell.major-right{border-right-color:var(--board-major)}
html[data-theme=dark][data-board] .board tr.major-bottom .cell{border-bottom-color:var(--board-major)}
html[data-theme=dark][data-board] .board tr:nth-child(2) .cell{border-top-color:var(--board-major)}
html[data-theme=dark][data-board] .board .cell:first-of-type{border-left-color:var(--board-major)}
html[data-theme=dark][data-board] .cell button.filled:where(:not(.correction-target,.fixed,.paper-mark,.guess,.ambiguous)),html[data-theme=dark][data-board] .cell button.filled:where(:not(.correction-target,.fixed,.paper-mark,.guess,.ambiguous)):hover:enabled{background:var(--board-fill)}
html[data-theme=dark][data-board] .cell button.empty:where(:not(.correction-target,.fixed,.paper-mark,.guess,.auto-cross)){background:var(--board-crossBg);color:var(--board-cross)}
html[data-theme=dark][data-board] .board th{color:var(--board-ink)}
html[data-theme=dark] .board-themes h2{color:#d8e8e0}
html[data-theme=dark] .board-themes-lead{color:#c2cabd}
html[data-theme=dark] .board-theme{background:#1e2521;border:1px solid #354039;color:inherit}
html[data-theme=dark] .board-theme.on{box-shadow:0 0 0 2px var(--green);border-color:transparent}
html[data-theme=dark] button.board-theme:focus-visible{outline:2px solid var(--green)}
html[data-theme=dark] .board-theme b{color:#d8e8e0}
html[data-theme=dark] .board-theme small{color:#c2cabd}
html[data-theme=dark] .board-theme.on small{color:var(--green)}
html[data-theme=dark] .board-theme-swatch i.x:before,html[data-theme=dark] .board-theme-swatch i.x:after{background:currentColor}
html[data-theme=dark] .board-themes-night{background:#1e2521f2;border:1px solid #354039}
html[data-theme=dark] .board-themes-night-icon{background:#30372b;color:var(--green)}
html[data-theme=dark] .board-themes-night-text b{color:#d8e8e0}
html[data-theme=dark] .board-themes-night-text small{color:#c2cabd}
html[data-theme=dark] .settings-board-row{color:inherit}
html[data-theme=dark] .settings-board-row strong{color:#d8e8e0}
html[data-theme=dark] .settings-board-go{color:#a2a99c}
html[data-theme=dark] .settings-board-icon i{background:currentColor}
html[data-theme=dark] .line-strip{background:#1e2521;border:1px solid #354039;box-shadow:0 -4px 14px #0000001d}
html[data-theme=dark] .line-step{color:#c1c9bc;background:#171e1a}
html[data-theme=dark] .line-close{background:none}
html[data-theme=dark] .line-name{color:#c1c9bc}
html[data-theme=dark] .line-clues{background:var(--green);color:#10251b}
html[data-theme=dark] .line-clues.error{background:#c0503f}
html[data-theme=dark] .line-board .cell{border-top:2px solid #859376;border-bottom:2px solid #859376}
html[data-theme=dark] .line-board .cell:last-child{border-right:2px solid #859376}
html[data-theme=dark] .board td.cell.line-on button:not(.filled):not(.empty){background:#151c17}
html[data-theme=dark] .board td.cell.line-on button.empty{background:#2d3530}
html[data-theme=dark] .board th.row-clue.line-on:not(.focus-axis,.correction-axis,.hint-line) .clue-button:not(.clue-error){background:#2d3630;color:var(--green)}
html[data-theme=dark] .board th.col-clue.line-on:not(.focus-axis,.correction-axis,.hint-line) .clue-button:not(.clue-error){color:var(--green)}
html[data-theme=dark] .board th.col-clue.line-on:not(.focus-axis,.correction-axis,.hint-line) .clue-button:not(.clue-error):before{background:#2d3630}
html[data-theme=dark] .zoom-menu .zoom-line{color:var(--green)}
html[data-theme=dark] .zoom-menu .zoom-line[aria-pressed=true]{background:#2c342f}
html[data-theme=dark] .today-event{background:linear-gradient(135deg,#181f1a,#1e2521);border:1px solid #453e33;color:#f0e5d9}
html[data-theme=dark] .today-event-link{color:inherit;text-decoration:none}
html[data-theme=dark] .today-event-link:after{border-radius:inherit}
html[data-theme=dark] .today-event-link:focus-visible{outline:none}
html[data-theme=dark] .today-event:has(.today-event-link:focus-visible){outline:2px solid var(--green)}
html[data-theme=dark] .today-event-eyebrow{color:#f4b97b}
html[data-theme=dark] .today-event-top small{color:#d5cbbe}
html[data-theme=dark] .event-postcard{background:#393227;border:1px dashed #494237;color:#d0a878}
html[data-theme=dark] .event-postcard.got{background:#1e2521;border:1px solid #453e33}
html[data-theme=dark] .event-header{background:linear-gradient(135deg,#181f1a,#2b342e)}
html[data-theme=dark] .event-header .pack-progress i{background:#d08a2e}
html[data-theme=dark] .picture-mosaic{border:1px solid #354039;background:var(--paper,#2c342e)}
html[data-theme=dark] .picture-piece{color:#bfc7b9;background:#2f3431}
html[data-theme=dark] .picture-piece.solved{background:var(--paper,#2c342e)}
html[data-theme=dark][data-theme=dark] .picture-mosaic{background:#1d2520}
html[data-theme=dark] .picture-piece.next{background:#1e2521;color:var(--green);box-shadow:inset 0 0 0 3px var(--green)}
html[data-theme=dark] button.picture-piece:focus-visible{outline:2px solid var(--green)}
html[data-theme=dark] .picture-next{background:#1e2521f2;border:1px solid #354039}
html[data-theme=dark] .picture-next-text b{color:#d8e8e0}
html[data-theme=dark] .picture-next-text small{color:#c2cabd}
html[data-theme=dark] .complete-picture.big i{background:transparent}
html[data-theme=dark] .today-tournament-note{color:#d5cbbe}
html[data-theme=dark] .tournament-hero{background:linear-gradient(135deg,#181f1a,#1e2521);border:1px solid #453e33;color:#f0e5d9}
html[data-theme=dark] .tournament-brow{color:#f4b97b}
html[data-theme=dark] .tournament-scale{color:#d5cbbe}
html[data-theme=dark] .tournament-scale .difficulty-tier i.on{background:#b0702a}
html[data-theme=dark] .tournament-who small{color:#bfc7b9}
html[data-theme=dark] .tournament-points{color:#c9d2c5}
html[data-theme=dark] .tournament-board-note{color:#bfc7b9}
html[data-theme=dark] .tournament-note{color:#bfc7b9}
html[data-theme=dark] .tournament-tile{background:#1e2521;border:1px solid #354039;color:#d3e3da}
html[data-theme=dark] button.tournament-tile:hover{border-color:#42493d}
html[data-theme=dark] .tournament-tile.current{border:1.5px solid var(--green)}
html[data-theme=dark] .tournament-tile.solved{background:#161c18;border-color:#3c4237}
html[data-theme=dark] .tournament-tile-points{color:#bfc7b9}
html[data-theme=dark] .tournament-tile.solved .tournament-tile-points{color:#a0ddb9}
html[data-theme=dark] .today .sets-note.announce{background:#1e2521;border:1px solid #354039;color:#d3e3da}
html[data-theme=dark] .sets-note .announce-icon{background:#30372b;color:var(--green)}
html[data-theme=dark] .board td.cell button.filled.pc1:where(:not(.correction-target,.guess)),html[data-theme=dark] .board td.cell button.filled.pc1:where(:not(.correction-target,.guess)):hover:enabled{background:var(--pc1)}
html[data-theme=dark] .board td.cell button.filled.guess.pc1{background:repeating-linear-gradient(45deg,var(--pc1) 0 1.8px,var(--color-guess-paper) 1.8px 4px)}
html[data-theme=dark] .board td.cell button.suggest-fill.sg1:not(.filled){background:repeating-linear-gradient(135deg,var(--pc1) 0 3px,var(--color-guess-paper) 3px 6px)}
html[data-theme=dark] .board td.cell button.filled.pc2:where(:not(.correction-target,.guess)),html[data-theme=dark] .board td.cell button.filled.pc2:where(:not(.correction-target,.guess)):hover:enabled{background:var(--pc2)}
html[data-theme=dark] .board td.cell button.filled.guess.pc2{background:repeating-linear-gradient(45deg,var(--pc2) 0 1.8px,var(--color-guess-paper) 1.8px 4px)}
html[data-theme=dark] .board td.cell button.suggest-fill.sg2:not(.filled){background:repeating-linear-gradient(135deg,var(--pc2) 0 3px,var(--color-guess-paper) 3px 6px)}
html[data-theme=dark] .board td.cell button.filled.pc3:where(:not(.correction-target,.guess)),html[data-theme=dark] .board td.cell button.filled.pc3:where(:not(.correction-target,.guess)):hover:enabled{background:var(--pc3)}
html[data-theme=dark] .board td.cell button.filled.guess.pc3{background:repeating-linear-gradient(45deg,var(--pc3) 0 1.8px,var(--color-guess-paper) 1.8px 4px)}
html[data-theme=dark] .board td.cell button.suggest-fill.sg3:not(.filled){background:repeating-linear-gradient(135deg,var(--pc3) 0 3px,var(--color-guess-paper) 3px 6px)}
html[data-theme=dark] .board td.cell button.filled.pc4:where(:not(.correction-target,.guess)),html[data-theme=dark] .board td.cell button.filled.pc4:where(:not(.correction-target,.guess)):hover:enabled{background:var(--pc4)}
html[data-theme=dark] .board td.cell button.filled.guess.pc4{background:repeating-linear-gradient(45deg,var(--pc4) 0 1.8px,var(--color-guess-paper) 1.8px 4px)}
html[data-theme=dark] .board td.cell button.suggest-fill.sg4:not(.filled){background:repeating-linear-gradient(135deg,var(--pc4) 0 3px,var(--color-guess-paper) 3px 6px)}
html[data-theme=dark] .board td.cell button.filled.pc5:where(:not(.correction-target,.guess)),html[data-theme=dark] .board td.cell button.filled.pc5:where(:not(.correction-target,.guess)):hover:enabled{background:var(--pc5)}
html[data-theme=dark] .board td.cell button.filled.guess.pc5{background:repeating-linear-gradient(45deg,var(--pc5) 0 1.8px,var(--color-guess-paper) 1.8px 4px)}
html[data-theme=dark] .board td.cell button.suggest-fill.sg5:not(.filled){background:repeating-linear-gradient(135deg,var(--pc5) 0 3px,var(--color-guess-paper) 3px 6px)}
html[data-theme=dark] .board td.cell button.filled.pc6:where(:not(.correction-target,.guess)),html[data-theme=dark] .board td.cell button.filled.pc6:where(:not(.correction-target,.guess)):hover:enabled{background:var(--pc6)}
html[data-theme=dark] .board td.cell button.filled.guess.pc6{background:repeating-linear-gradient(45deg,var(--pc6) 0 1.8px,var(--color-guess-paper) 1.8px 4px)}
html[data-theme=dark] .board td.cell button.suggest-fill.sg6:not(.filled){background:repeating-linear-gradient(135deg,var(--pc6) 0 3px,var(--color-guess-paper) 3px 6px)}
html[data-theme=dark] .board td.cell button.filled.pc7:where(:not(.correction-target,.guess)),html[data-theme=dark] .board td.cell button.filled.pc7:where(:not(.correction-target,.guess)):hover:enabled{background:var(--pc7)}
html[data-theme=dark] .board td.cell button.filled.guess.pc7{background:repeating-linear-gradient(45deg,var(--pc7) 0 1.8px,var(--color-guess-paper) 1.8px 4px)}
html[data-theme=dark] .board td.cell button.suggest-fill.sg7:not(.filled){background:repeating-linear-gradient(135deg,var(--pc7) 0 3px,var(--color-guess-paper) 3px 6px)}
html[data-theme=dark] .board td.cell button.filled.pc8:where(:not(.correction-target,.guess)),html[data-theme=dark] .board td.cell button.filled.pc8:where(:not(.correction-target,.guess)):hover:enabled{background:var(--pc8)}
html[data-theme=dark] .board td.cell button.filled.guess.pc8{background:repeating-linear-gradient(45deg,var(--pc8) 0 1.8px,var(--color-guess-paper) 1.8px 4px)}
html[data-theme=dark] .board td.cell button.suggest-fill.sg8:not(.filled){background:repeating-linear-gradient(135deg,var(--pc8) 0 3px,var(--color-guess-paper) 3px 6px)}
html[data-theme=dark] .board td.cell button.filled.pc9:where(:not(.correction-target,.guess)),html[data-theme=dark] .board td.cell button.filled.pc9:where(:not(.correction-target,.guess)):hover:enabled{background:var(--pc9)}
html[data-theme=dark] .board td.cell button.filled.guess.pc9{background:repeating-linear-gradient(45deg,var(--pc9) 0 1.8px,var(--color-guess-paper) 1.8px 4px)}
html[data-theme=dark] .board td.cell button.suggest-fill.sg9:not(.filled){background:repeating-linear-gradient(135deg,var(--pc9) 0 3px,var(--color-guess-paper) 3px 6px)}
html[data-theme=dark] .board td.cell button.filled.pc10:where(:not(.correction-target,.guess)),html[data-theme=dark] .board td.cell button.filled.pc10:where(:not(.correction-target,.guess)):hover:enabled{background:var(--pc10)}
html[data-theme=dark] .board td.cell button.filled.guess.pc10{background:repeating-linear-gradient(45deg,var(--pc10) 0 1.8px,var(--color-guess-paper) 1.8px 4px)}
html[data-theme=dark] .board td.cell button.suggest-fill.sg10:not(.filled){background:repeating-linear-gradient(135deg,var(--pc10) 0 3px,var(--color-guess-paper) 3px 6px)}
html[data-theme=dark] .board td.cell button.filled.pc11:where(:not(.correction-target,.guess)),html[data-theme=dark] .board td.cell button.filled.pc11:where(:not(.correction-target,.guess)):hover:enabled{background:var(--pc11)}
html[data-theme=dark] .board td.cell button.filled.guess.pc11{background:repeating-linear-gradient(45deg,var(--pc11) 0 1.8px,var(--color-guess-paper) 1.8px 4px)}
html[data-theme=dark] .board td.cell button.suggest-fill.sg11:not(.filled){background:repeating-linear-gradient(135deg,var(--pc11) 0 3px,var(--color-guess-paper) 3px 6px)}
html[data-theme=dark] .board td.cell button.filled.pc12:where(:not(.correction-target,.guess)),html[data-theme=dark] .board td.cell button.filled.pc12:where(:not(.correction-target,.guess)):hover:enabled{background:var(--pc12)}
html[data-theme=dark] .board td.cell button.filled.guess.pc12{background:repeating-linear-gradient(45deg,var(--pc12) 0 1.8px,var(--color-guess-paper) 1.8px 4px)}
html[data-theme=dark] .board td.cell button.suggest-fill.sg12:not(.filled){background:repeating-linear-gradient(135deg,var(--pc12) 0 3px,var(--color-guess-paper) 3px 6px)}
html[data-theme=dark] .board td.cell button.fixed.filled[class*=" pc"]{box-shadow:inset 0 0 0 max(2px,calc(var(--cell)*.12)) #cd8377}
html[data-theme=dark] .board th .clue-button span.color-chip,html[data-theme=dark] .line-clues span.color-chip{border-radius:max(2px,calc(var(--cell)*.12));background:var(--chip);color:var(--chip-ink)}
html[data-theme=dark] .color-swatch-dot{background:var(--chip);box-shadow:0 0 0 2px #454947,0 0 0 3px #4a584f}
html[data-theme=dark] .paint-tools .color-swatch.active .color-swatch-dot{box-shadow:0 0 0 2px #454947,0 0 0 4px var(--green)}
html[data-theme=dark][data-theme=dark] .color-swatch-dot{box-shadow:0 0 0 2px #5e6761,0 0 0 3px #808d85}
html[data-theme=dark][data-theme=dark] .paint-tools .color-swatch.active .color-swatch-dot{box-shadow:0 0 0 2px #5e6761,0 0 0 4px var(--green)}
html[data-theme=dark] .color-palette.own-row{background:#161d19}
html[data-theme=dark] .color-palette.own-row .color-swatch{background:transparent}
html[data-theme=dark] .color-palette.own-row .color-swatch.active{background:#1e2521;box-shadow:0 1px 4px #00000024}
html[data-theme=dark] .board td.cell button.filled.correction-target.pc1,html[data-theme=dark] .board td.cell button.filled.correction-target.pc2,html[data-theme=dark] .board td.cell button.filled.correction-target.pc3,html[data-theme=dark] .board td.cell button.filled.correction-target.pc4,html[data-theme=dark] .board td.cell button.filled.correction-target.pc5,html[data-theme=dark] .board td.cell button.filled.correction-target.pc6,html[data-theme=dark] .board td.cell button.filled.correction-target.pc7,html[data-theme=dark] .board td.cell button.filled.correction-target.pc8,html[data-theme=dark] .board td.cell button.filled.correction-target.pc9,html[data-theme=dark] .board td.cell button.filled.correction-target.pc10,html[data-theme=dark] .board td.cell button.filled.correction-target.pc11,html[data-theme=dark] .board td.cell button.filled.correction-target.pc12{background:linear-gradient(to top right,transparent calc(50% - max(1px,calc(var(--cell)*.06))),#c62f24 calc(50% - max(1px,calc(var(--cell)*.06))) calc(50% + max(1px,calc(var(--cell)*.06))),transparent calc(50% + max(1px,calc(var(--cell)*.06)))),var(--mistake-fill);box-shadow:inset 0 0 0 max(2px,calc(var(--cell)*.1)) #c62f24,inset 0 0 0 max(3px,calc(var(--cell)*.17)) #454947}
html[data-theme=dark] .print-chip sub{border:.14em solid #bdcac1;background:#1f2621;color:#dfeee5}
html[data-theme=dark] .print-legend{color:#dfeee5}
html[data-theme=dark] .color-dots{background:#1e2521;box-shadow:0 2px 6px #0000001f}
html[data-theme=dark] .color-empty{border:1.5px dashed #3f4539;background:#1e2521b3}
html[data-theme=dark] .color-empty b{color:#d3e3da}
html[data-theme=dark] .color-empty span{color:#c2cabd}
html[data-theme=dark] .color-legend li{background:#1e2521cc}
html[data-theme=dark] .color-legend-more button{background:none;color:inherit}
html[data-theme=dark] .color-tile-dots b{color:#bfc7b9}
html[data-theme=dark] .color-chip.joint-dot:after{background:#77877d}
html[data-theme=dark] .line-clues span.color-chip.joint-dot:after{background:#1e2521d9}
html[data-theme=dark][data-theme=dark] .color-chip.joint-dot:after{background:#8f9a8a}
html[data-theme=dark][data-theme=dark] .line-clues span.color-chip.joint-dot:after{background:#1e2521d9}
html[data-theme=dark] .settings-joints-icon i{background:#e08a3c}
html[data-theme=dark] .settings-joints-icon i+i{background:#86ad2a}
html[data-theme=dark] .settings-joints-icon i+i:before{background:currentColor}
html[data-theme=dark][data-theme=dark] .settings-joints-icon i{background:#eda05c}
html[data-theme=dark][data-theme=dark] .settings-joints-icon i+i{background:#a6cc4f}
html[data-theme=dark] .menu-continue{background:linear-gradient(#367457,#245640);color:#ffffff}
html[data-theme=dark] .menu-tiles>button{background:#171e1a;color:#d3e3da}
html[data-theme=dark] .menu-tiles svg{fill:none;stroke:var(--green)}
html[data-theme=dark] .menu-group{background:#1a201c}
html[data-theme=dark] .menu-group>b{color:#c0c9bc}
html[data-theme=dark] .menu-row{border-top:1px solid #363d38;color:inherit}
html[data-theme=dark] .menu-row>span:first-child{color:#b0b7aa}
html[data-theme=dark] .menu-row small{color:#bac1b4}
html[data-theme=dark] .menu-row>span:nth-child(3):not(.lang-switch):not(.menu-value){color:#b2b9ac}
html[data-theme=dark] .menu-row.danger strong{color:#ffad9a}
html[data-theme=dark] .menu-value{color:#bac1b4}
html[data-theme=dark] .menu-row input[type=checkbox]{background:#333e37}
html[data-theme=dark] .menu-row input[type=checkbox]:before{background:#1f2621;box-shadow:0 1px 3px #0000005c}
html[data-theme=dark] .menu-row input[type=checkbox]:checked{background:var(--green)}
html[data-theme=dark] #settings-all{color:var(--green)}
html[data-theme=dark] .menu-admin{border:1.5px dashed #3d4941;color:#ccbcb6}
html[data-theme=dark] .puzzle.playing .play-pause{background:#2c342e;color:var(--green)}
html[data-theme=dark] .board-fit{background:#253d33;color:#ffffff;box-shadow:0 6px 14px #0000005c}
@media(min-width:1100px){
html[data-theme=dark] .puzzle.playing .play-bar>#settings-helpers{background:#1e2521f2;border:1px solid #354039}
html[data-theme=dark] .puzzle.playing .play-keys-toggle{border:1px dashed #37433b;color:#c0c9bc}
html[data-theme=dark] .puzzle.playing .play-keys-toggle span+span{color:var(--green)}
}
html[data-theme=dark][data-theme=dark] .menu-tiles>button{background:#252d28;color:#dfe6dc}
html[data-theme=dark][data-theme=dark] .menu-tiles svg{stroke:#9fd0b2}
html[data-theme=dark][data-theme=dark] .menu-group{background:#1c231f}
html[data-theme=dark][data-theme=dark] .menu-group>b{color:#9ea699}
html[data-theme=dark][data-theme=dark] .menu-row{border-top-color:#b7c1ba}
html[data-theme=dark][data-theme=dark] .menu-row>span:first-child{color:#9aa194}
html[data-theme=dark][data-theme=dark] .menu-row small,html[data-theme=dark][data-theme=dark] .menu-value{color:#9ea699}
html[data-theme=dark][data-theme=dark] .menu-row.danger strong{color:#c3897c}
html[data-theme=dark][data-theme=dark] .menu-row input[type=checkbox]{background:#3a443e}
html[data-theme=dark][data-theme=dark] .menu-row input[type=checkbox]:checked{background:#5e9c7c}
html[data-theme=dark][data-theme=dark] #settings-all{color:#9fd0b2}
html[data-theme=dark][data-theme=dark] .menu-admin{border-color:#a6b5aa;color:#a59790}
html[data-theme=dark][data-theme=dark] .puzzle.playing .play-pause{background:#27312b;color:#a9d1b5}
html[data-theme=dark][data-theme=dark] .board-fit{background:#323834;color:#e3ece7}
html[data-theme=dark][data-theme=dark] .puzzle.playing .play-bar>#settings-helpers{background:#1e2521f2;border-color:#b1beb5}
html[data-theme=dark][data-theme=dark] .puzzle.playing .play-keys-toggle{border-color:#aebdb3;color:#9ea699}
html[data-theme=dark][data-theme=dark] .puzzle.playing .play-keys-toggle span+span{color:#9fd0b2}
html[data-theme=dark][data-theme=dark] .play-pack{background:#2c342e;background:color-mix(in srgb,var(--pack-bg,#2c342e) 16%,#1e2521)}
html[data-theme=dark][data-theme=dark] .menu-continue{background:linear-gradient(#3f8a66,#2c6b4f);color:#ffffff}
html[data-theme=dark] .settings-me{background:#1e2521f2;border:1px solid #354039}
html[data-theme=dark] .settings-avatar{background:var(--green);color:#10251b}
html[data-theme=dark] .settings-me-text strong{color:#d8e8e0}
html[data-theme=dark] .settings-me-text small{color:#bfc7b9}
html[data-theme=dark] .settings-me-plan strong{background:#2c342e;color:var(--green)}
html[data-theme=dark] .settings-plus{background:#262b28;color:#f3d27a}
html[data-theme=dark] #settings .settings-group>b{color:#c0c9bc}
html[data-theme=dark] #settings .settings-row>span:first-child{color:#d3e3da}
html[data-theme=dark] #settings .settings-row input[type=checkbox]{background:#333e37}
html[data-theme=dark] #settings .settings-row input[type=checkbox]:before{background:#1f2621;box-shadow:0 1px 3px #0000005c}
html[data-theme=dark] #settings .settings-row input[type=checkbox]:checked{background:var(--green)}
html[data-theme=dark] #settings .settings-action{color:inherit;text-decoration:none}
html[data-theme=dark] #settings .settings-action>span:last-child,html[data-theme=dark] #settings .settings-chev{color:#b2b9ac}
html[data-theme=dark] #settings .settings-action.danger>span:first-child{color:#ffad9a}
@media(min-width:1100px){
html[data-theme=dark] #settings .settings-index button{color:#c2cabd}
html[data-theme=dark] #settings .settings-index button[aria-current=true]{background:#30372b;color:var(--green)}
}
html[data-theme=dark][data-theme=dark] .settings-me{background:#1e2521f2;border-color:#b1beb5}
html[data-theme=dark][data-theme=dark] .settings-me-text strong{color:#e4ece1}
html[data-theme=dark][data-theme=dark] .settings-me-text small{color:#bfc7b9}
html[data-theme=dark][data-theme=dark] .settings-me-plan strong{background:#27312b;color:#a9d1b5}
html[data-theme=dark][data-theme=dark] .settings-plus{background:#262b28;color:#f3d27a}
html[data-theme=dark][data-theme=dark] #settings .settings-group>b{color:#9ea699}
html[data-theme=dark][data-theme=dark] #settings .settings-row>span:first-child{color:#dfe6dc}
html[data-theme=dark][data-theme=dark] #settings .settings-row input[type=checkbox]{background:#3a443e}
html[data-theme=dark][data-theme=dark] #settings .settings-row input[type=checkbox]:checked{background:#5e9c7c}
html[data-theme=dark][data-theme=dark] #settings .settings-action.danger>span:first-child{color:#ffaa9c}
html[data-theme=dark][data-theme=dark] #settings .settings-index button{color:#c2cabd}
html[data-theme=dark][data-theme=dark] #settings .settings-index button[aria-current=true]{background:#27312b;color:#a9d1b5}
html[data-theme=dark][data-theme=dark] .settings-avatar{background:linear-gradient(135deg,#367457 0%,#245640 100%)}
html[data-theme=dark] .band-skeleton .band-head h2{background:#303632}
html[data-theme=dark] .pack-header.pack-skeleton{background:#2f3431}
html[data-theme=dark] .pack-header.pack-skeleton i{background:#323935}
html[data-theme=dark] .pack-body.pack-skeleton .pack-tile{background:#2f3431}
html[data-theme=dark][data-theme=dark] .band-skeleton .band-head h2,html[data-theme=dark][data-theme=dark] .pack-header.pack-skeleton i{background:#303632}
html[data-theme=dark][data-theme=dark] .pack-header.pack-skeleton,html[data-theme=dark][data-theme=dark] .pack-body.pack-skeleton .pack-tile{background:#1f2621}
html[data-theme=dark] .button.primary.danger{background:#a8463b;border-color:#ea8173;color:#ffffff}
html[data-theme=dark][data-theme=dark] .button.primary.danger{background:#a8463b;border-color:#cc6659;color:#ffffff}
@media(max-width:600px){
html[data-theme=dark] dialog.clue-editor::backdrop{background:#35463326}
}
html[data-theme=dark] .shop-card{background:#1e2521f2;border:1px solid #354039;color:#d3e3da}
html[data-theme=dark] .shop-card h2{color:#d8e8e0}
html[data-theme=dark] .shop-have-note{color:#c2cabd}
html[data-theme=dark] .shop-icon{background:#30372b;color:var(--green)}
html[data-theme=dark] .shop-icon.ice{background:#2e3530;color:#8ecffa}
html[data-theme=dark] .shop-icon.fire{background:#151c17;color:#ecab6d}
html[data-theme=dark] .shop-icon.star{background:#161c18;color:#e2b667}
html[data-theme=dark] .shop-have-row{border-top:1px solid #353b37}
html[data-theme=dark] .shop-have-row strong{color:#d8e8e0}
html[data-theme=dark] .shop-row-text b{color:#d8e8e0}
html[data-theme=dark] .shop-row-text small{color:#c2cabd}
html[data-theme=dark] .shop-plus{background:linear-gradient(135deg,#30372b,#171e19);border:1px solid #3b4136}
html[data-theme=dark] .shop-plus-crown{background:var(--green);color:#10251b}
html[data-theme=dark] .shop-plus-text b{color:#d8e8e0}
html[data-theme=dark] .shop-plus-text small{color:#c2cabd}
html[data-theme=dark] .shop-note{color:#c2cabd}
html[data-theme=dark] .shop-restore{color:var(--green)}
html[data-theme=dark] .shop-text{color:#c2cabd}
html[data-theme=dark] .shop-offer{background:#171e1a;border:1px solid #354039;color:inherit}
html[data-theme=dark] .shop-offer b{color:#d8e8e0}
html[data-theme=dark] .shop-offer small{color:#c2cabd}
html[data-theme=dark] .shop-best{color:#10251b;background:var(--green)}
html[data-theme=dark] .shop-price{background:#1e2521;border:1px solid #354039;color:var(--green)}
html[data-theme=dark] .shop-buy{background:#2c342e}
html[data-theme=dark] .shop-offer:focus-visible,html[data-theme=dark] .shop-buy:focus-visible,html[data-theme=dark] .shop-theme:focus-visible{outline:2px solid var(--green)}
html[data-theme=dark] .shop-row{border-top:1px solid #353b37}
html[data-theme=dark] .shop-owned{color:#aecc9e}
html[data-theme=dark] .shop-theme{background:#171e1a;border:1px solid #354039;color:inherit}
html[data-theme=dark] .shop-theme.on{box-shadow:0 0 0 2px var(--green);border-color:transparent}
html[data-theme=dark] .shop-theme b{color:#d8e8e0}
html[data-theme=dark] .shop-price-text{color:var(--green)}
html[data-theme=dark] .plus-pack{border-top:1px solid #353b37;color:inherit}
html[data-theme=dark] .plus-pack b{color:#d8e8e0}
html[data-theme=dark] .plus-pack small{color:#c2cabd}
html[data-theme=dark] .board-theme.trying{box-shadow:0 0 0 2px #d08a2e;border-color:transparent}
html[data-theme=dark] .board-themes-buy p{color:#c2cabd}
html[data-theme=dark][data-theme=dark] .shop-card{background:#1e2521f2;border-color:#b1beb5;color:#d8e8e0}
html[data-theme=dark][data-theme=dark] .shop-card h2,html[data-theme=dark][data-theme=dark] .shop-row-text b,html[data-theme=dark][data-theme=dark] .shop-have-row strong,html[data-theme=dark][data-theme=dark] .shop-offer b,html[data-theme=dark][data-theme=dark] .shop-theme b,html[data-theme=dark][data-theme=dark] .shop-plus-text b,html[data-theme=dark][data-theme=dark] .plus-pack b{color:#d8e8e0}
html[data-theme=dark][data-theme=dark] .shop-row-text small,html[data-theme=dark][data-theme=dark] .shop-have-note,html[data-theme=dark][data-theme=dark] .shop-offer small,html[data-theme=dark][data-theme=dark] .shop-text,html[data-theme=dark][data-theme=dark] .shop-note,html[data-theme=dark][data-theme=dark] .shop-plus-text small,html[data-theme=dark][data-theme=dark] .plus-pack small,html[data-theme=dark][data-theme=dark] .board-themes-buy p{color:#bfc7b9}
html[data-theme=dark][data-theme=dark] .shop-have-row,html[data-theme=dark][data-theme=dark] .shop-row,html[data-theme=dark][data-theme=dark] .plus-pack{border-color:#b4c1b8}
html[data-theme=dark][data-theme=dark] .shop-icon{background:#2b3830}
html[data-theme=dark][data-theme=dark] .shop-icon.ice{background:#1d2d38;color:#70a3c5}
html[data-theme=dark][data-theme=dark] .shop-icon.fire{background:#3a2c18;color:#c9914b}
html[data-theme=dark][data-theme=dark] .shop-icon.star{background:#3a3218;color:#e9c35e}
html[data-theme=dark][data-theme=dark] .shop-offer,html[data-theme=dark][data-theme=dark] .shop-theme{background:#212a24;border-color:#b1beb5}
html[data-theme=dark][data-theme=dark] .shop-price{background:#1e2521;border-color:#b1beb5}
html[data-theme=dark][data-theme=dark] .shop-buy{background:#27312b}
html[data-theme=dark][data-theme=dark] .shop-owned{color:#86a577}
html[data-theme=dark][data-theme=dark] .shop-plus{background:linear-gradient(135deg,#233128,#1e2521);border-color:#b1beb5}
html[data-theme=dark][data-theme=dark] .shop-plus-crown{background:#3f7a5c}
html[data-theme=dark][data-theme=dark] .shop-best{background:#3f7a5c}
html[data-theme=dark] .pack-tile-video{background:#262b28;color:#f3d27a}
html[data-theme=dark] .pack-tile.plus.video{border:2px dashed #44493e}
html[data-theme=dark] .pack-tile.by-video:after{color:#a3bb93}
html[data-theme=dark] .pack-tile.fresh{box-shadow:0 0 0 4px #495242,0 0 0 6px #505e47}
html[data-theme=dark] .pack-videos{background:#1e2521;border:1px solid #354039}
html[data-theme=dark] .pack-videos-head strong{color:#d8e8e0}
html[data-theme=dark] .pack-videos-head em{color:#c2cabd}
html[data-theme=dark] .pack-videos-icon{background:#161c18;color:#d9ad5e}
html[data-theme=dark] .pack-videos-meter i{background:#313a34}
html[data-theme=dark] .pack-videos-meter i.on{background:var(--green)}
html[data-theme=dark] .pack-videos small{color:#c2cabd}
html[data-theme=dark] .pack-videos-plus{border:1px solid #3b4136;background:linear-gradient(135deg,#30372b,#171e19);color:#d3e3da}
html[data-theme=dark] .pack-videos-plus b{color:#d8e8e0}
html[data-theme=dark] .pack-videos-plus small{color:#c2cabd}
html[data-theme=dark] .guest-video{color:#c2cabd}
html[data-theme=dark][data-theme=dark] .pack-tile-video{background:#262b28;color:#f3d27a}
html[data-theme=dark][data-theme=dark] .pack-tile.plus.video{border-color:#a6b3aa}
html[data-theme=dark][data-theme=dark] .pack-tile.fresh{box-shadow:0 0 0 4px #65756b,0 0 0 6px #4f7a5f}
html[data-theme=dark][data-theme=dark] .pack-videos{background:#1e2521;border-color:#b1beb5}
html[data-theme=dark][data-theme=dark] .pack-videos-head strong,html[data-theme=dark][data-theme=dark] .pack-videos-plus b{color:#d8e8e0}
html[data-theme=dark][data-theme=dark] .pack-videos-head em,html[data-theme=dark][data-theme=dark] .pack-videos small,html[data-theme=dark][data-theme=dark] .pack-videos-plus small,html[data-theme=dark][data-theme=dark] .guest-video{color:#c2cabd}
html[data-theme=dark][data-theme=dark] .pack-videos-icon{background:#3a3218;color:#e9c35e}
html[data-theme=dark][data-theme=dark] .pack-videos-meter i{background:#2f3a33}
html[data-theme=dark][data-theme=dark] .pack-videos-plus{background:linear-gradient(135deg,#233128,#1d2520);border-color:#b1beb5;color:#d3e3da}
html[data-theme=dark] .done-ad-label{background:#181f1a;color:#acb2a4}
html[data-theme=dark] .done-ad-slot{border:1px dashed #42453a;background:#161c18}
html[data-theme=dark] .done-ad-demo{color:#b4bbae}
html[data-theme=dark] .done-ad-foot{color:#c2cabd}
html[data-theme=dark] .done-ad-foot a{color:var(--green)}
html[data-theme=dark][data-theme=dark] .done-ad-label{background:#151b17;color:#a8b1a5}
html[data-theme=dark][data-theme=dark] .done-ad-slot{background:#1a211c;border-color:#adbbb2}
html[data-theme=dark][data-theme=dark] .done-ad-demo,html[data-theme=dark][data-theme=dark] .done-ad-foot{color:#9da69a}
html[data-theme=dark]{color-scheme:dark;--green:#8fc4a3;--muted:#97a491;--line:#2f3a33;--surface:#1d2520}
html[data-theme=dark] body,html[data-theme=dark] main{background:#151b17;color:#dfe6dc}
html[data-theme=dark] .topbar{background:#1a211c;border-color:#2b352f}
html[data-theme=dark] .tab-bar{background:#1a211c;border-color:#2b352f}
html[data-theme=dark] .view-title,html[data-theme=dark] .pack-title,html[data-theme=dark] .league-week-title{color:#e8eee4}
/* Primary actions: light green with dark text, as the mockup's accents. */
html[data-theme=dark] .primary,html[data-theme=dark] .button.primary{background:#8fc4a3;color:#10251b}
html[data-theme=dark] .primary:disabled{background:#3a4a40;color:#9aa893}
/* The board: filled — light green, cross — grey, error — red, hint — green frame (e11, legend). */
html[data-theme=dark] .board-sheet,html[data-theme=dark] .board .cell{background:#202923}
html[data-theme=dark] .board .cell{border-color:#323d36}
html[data-theme=dark] .board .cell.major-right{border-right-color:#6d8070}
html[data-theme=dark] .board tr.major-bottom .cell{border-bottom-color:#6d8070}
html[data-theme=dark] .board tr:nth-child(2) .cell{border-top-color:#6d8070}
html[data-theme=dark] .board .cell:first-of-type{border-left-color:#6d8070}
html[data-theme=dark] .cell button{color:#66735f}
html[data-theme=dark] .cell button.filled,html[data-theme=dark] .cell button.filled:hover:enabled{background:#8fc4a3}
html[data-theme=dark] .cell button.empty{background:#202923;color:#7d8a76}
html[data-theme=dark] .cell button:hover:enabled{background:#2b3530}
html[data-theme=dark] .board th{color:#c9d4c4}
html[data-theme=dark] .clue-button:hover{background:#2b3530}
/* T10 — the guess: pencil strokes of the light green on the board's dark paper; the mini picture in the same green. */
html[data-theme=dark] .board td.cell button.filled.guess,html[data-theme=dark] .board td.cell button.filled.guess:hover:enabled,html[data-theme=dark] .guess-swatch{background:repeating-linear-gradient(45deg,#8fc4a3 0 1.6px,#202923 1.6px 4px)}
html[data-theme=dark] .board td.cell button.empty.guess{background:#26312b;color:#8fc4a3}
html[data-theme=dark] .play-mini{color:#8fc4a3}
/* Empty squares of the difficulty scale stay readable next to the filled ones. */
html[data-theme=dark] .difficulty-tier i{background:#3b4740}
html[data-theme=dark] .difficulty-tier i.on{background:var(--green)}
html[data-theme=dark] .difficulty-tier.players i.on{background:#d9a24a}
/* Covers of packs keep their pastel paper and picture (set by app.js), dimmed together so the picture stays readable. */
html[data-theme=dark] .pack-card-cover,html[data-theme=dark] .sets-continue-cover,html[data-theme=dark] #today-continue-cover,html[data-theme=dark] .band-lock-cover{filter:brightness(.8) saturate(.9)}
/* Cards with text over a pastel pack colour: the colour is darkened under the light text, keeping its hue. */
html[data-theme=dark] .pack-header,html[data-theme=dark] .today-pack{box-shadow:inset 0 0 0 100vmax #151b17c7}
}
/* T09 — конец тёмной темы */
/* T03 — зачёркнутые числа, автокрестики, неверное число (docs/roadmap/mockups/e11-play-tools, 1.13, 1.5, 1.12) */
.clue-button>span[data-i]{position:relative}
.board th .clue-button>span.struck{color:#a9b39f}
/* Struck: a grey half-clear stroke from the lower left corner of the number to the upper right one. */
.clue-button>span.struck:after,.clue-button>span.strike-gone:after{content:'';position:absolute;inset:-1px -2px;pointer-events:none;background:linear-gradient(to top right,transparent calc(50% - 1px),rgba(96,112,96,.5) calc(50% - 1px),rgba(96,112,96,.5) calc(50% + 1px),transparent calc(50% + 1px))}
.clue-button>span.strike-fresh:after{animation:strike-draw .3s ease-out both}
.clue-button>span.strike-gone:after{animation:strike-erase .3s ease-in both}
@keyframes strike-draw{from{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0)}}
@keyframes strike-erase{from{clip-path:inset(0)}to{clip-path:inset(0 0 0 100%)}}
.board th.hint-line .clue-button>span.struck{color:#ffffffa6}
.board th.hint-line .clue-button>span.struck:after{background:linear-gradient(to top right,transparent calc(50% - 1px),#ffffffa6 calc(50% - 1px),#ffffffa6 calc(50% + 1px),transparent calc(50% + 1px))}
.clue-button>span.strike-refused{animation:clue-shake .3s ease-in-out}
/* The marks contradict the numbers: the line's numbers red, on a light red ground; they shake once. */
.board th .clue-button.clue-error{color:#c0503f}
.board th .clue-button.clue-error>span{animation:clue-shake .3s ease-in-out}
.board th.row-clue .clue-button.clue-error{background:#f8e5e0;border-radius:6px}
.board th.col-clue .clue-button.clue-error{isolation:isolate}
.board th.col-clue .clue-button.clue-error:before{content:'';position:absolute;inset:-5px 0;z-index:-1;border-radius:7px;background:#f8e5e0}
@keyframes clue-shake{0%,100%{transform:none}25%{transform:translateX(-2px)}75%{transform:translateX(2px)}}
.board th.col-clue .clue-button.clue-error>span{animation-name:clue-shake-col}
@keyframes clue-shake-col{0%,100%{transform:none}25%{transform:translateY(-2px)}75%{transform:translateY(2px)}}
/* The app's crosses: lighter, on a ground of their own; they come in a wave along the line. */
/* The player's crosses already lie on a ground (#f3f5ec): the app's are paler, smaller, on a lighter one. */
.board td.cell button.empty.auto-cross{color:#c7cebd;background:#f9faf5}
.board td.cell button.empty.auto-cross:before,.board td.cell button.empty.auto-cross:after{width:36%}
.board td.cell button.cross-fresh{animation:cross-in .25s ease-out both}
@keyframes cross-in{from{opacity:0}to{opacity:1}}
.settings-list>.settings-toggle{display:flex;align-items:center;gap:14px;min-height:74px;padding:12px 4px;border-top:1px solid #ecede5;cursor:pointer}
.settings-list>.settings-toggle[hidden]{display:none}
.settings-list>.settings-toggle>span:first-child{display:grid;place-items:center;width:36px;height:36px;color:#7d906e;font-size:26px;flex-shrink:0}
.settings-list>.settings-toggle>span:nth-child(2){flex:1}
.settings-list>.settings-toggle input{flex:none;width:20px;height:20px;margin:0 6px 0 0;accent-color:var(--green)}
.settings-strike-icon{position:relative;font-family:Georgia,serif;font-size:22px!important}
.settings-strike-icon:after{content:'';position:absolute;inset:6px 8px;background:linear-gradient(to top right,transparent calc(50% - 1px),currentColor calc(50% - 1px),currentColor calc(50% + 1px),transparent calc(50% + 1px))}
@media(max-width:760px){.settings-list>.settings-toggle{min-height:72px}}

/* T13 — разминка (docs/roadmap/mockups/e12-habit, 2.10) */
.warmup-close{display:none}
.play-bar.warmup .play-back>svg:not(.warmup-close){display:none}
.play-bar.warmup .play-back .warmup-close{display:block}
.warmup-steps{position:absolute;left:14px;right:14px;bottom:5px;height:3px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px}
.warmup-steps[hidden],.play-bar.warmup .play-progress{display:none}
.warmup-steps i{border-radius:2px;background:#e7ebdd}
.warmup-steps i.done{background:var(--green)}
.warmup-steps i.now{background:#9db58d}
@media(min-width:1100px){.puzzle.playing .warmup-steps{position:static;height:6px;flex-basis:100%;order:2}}
.warmup-inner{max-width:420px;min-height:100%;justify-content:center}
.warmup-meta{margin:-8px 0 0;font-size:14px;color:#5f6b57}
.warmup-pictures{display:flex;gap:12px;align-items:flex-end}
.warmup-picture{padding:6px;border-radius:12px;background:#fffef9;border:1px solid #e1e5d6;box-shadow:0 8px 20px #3b4f3014}
.warmup-picture .pixel-grid{display:grid;border-radius:3px;overflow:hidden}
.warmup-picture:nth-child(1) .pixel-grid{width:52px}.warmup-picture:nth-child(2) .pixel-grid{width:64px}.warmup-picture:nth-child(3) .pixel-grid{width:76px}
.warmup-card{display:flex;align-items:center;gap:12px;padding:14px 16px;border-radius:16px;background:#fffef9f2;border:1px solid #e1e5d7}
.warmup-card>span:last-child{display:flex;flex-direction:column;gap:2px}
.warmup-card strong{font-size:15px;font-weight:650}
.warmup-card small{font-size:13px;color:#5f6b57}
.warmup-flame svg{width:28px;height:28px;fill:#d08a2e}
.warmup-go{width:100%;min-height:50px;border-radius:999px;font-size:15px;font-weight:650;justify-content:center}
/* T09 — поле с перебором в наборе (скрывать поля с перебором, e11-play-tools 2.12) */
.pack-tile-trial{padding:3px 8px;border-radius:999px;background:#eef0e7;color:#5f6d57;font-size:11px;font-weight:650}
/* T02 — клетка ⇄ крестик, счётчик протяжки, подсветка, клавиатура (docs/roadmap/mockups/e11-play-tools, 1.3, 1.4, 1.6–1.7) */
.action-dock .paint-tools button{position:relative}
.dock-key{display:none}
@media(hover:hover) and (pointer:fine){
  .dock-key{display:block;position:absolute;right:1px;top:1px;min-width:7px;padding:0 2px;border-radius:3px;background:#fff;border:1px solid #dcded3;font:650 8px/10px Inter,-apple-system,sans-serif;color:#5f6b57;text-align:center}
}
/* The other mark held by a long press or Shift: the tool lights up with a ring. */
.paint-tools button.held{color:var(--green);box-shadow:0 1px 4px #394d3014,0 0 0 2px #295c4766}
.press-ring{position:fixed;z-index:30;width:56px;height:56px;margin:-28px 0 0 -28px;pointer-events:none}
.press-ring[hidden]{display:none}
.press-ring svg{width:100%;height:100%;transform:rotate(-90deg)}
.press-ring circle{fill:#295c4714;stroke:var(--green);stroke-width:3;stroke-linecap:round;stroke-dasharray:132;stroke-dashoffset:132}
.press-ring.filling circle{animation:press-fill .35s linear forwards}
@keyframes press-fill{to{stroke-dashoffset:0}}
.stroke-badge{position:fixed;z-index:30;left:0;top:0;min-width:14px;padding:4px 9px;border-radius:10px;background:#253d33;color:#fff;font-size:14px;font-weight:800;line-height:1.25;text-align:center;font-variant-numeric:tabular-nums;box-shadow:0 6px 14px #0003;pointer-events:none}
.stroke-badge[hidden]{display:none}
.stroke-badge:after{content:'';position:absolute;border:5px solid transparent}
.stroke-badge[data-side=top]:after{left:50%;bottom:-5px;margin-left:-5px;border-bottom:0;border-top-color:#253d33}
.stroke-badge[data-side=bottom]:after{left:50%;top:-5px;margin-left:-5px;border-top:0;border-bottom-color:#253d33}
.stroke-badge[data-side=left]:after{top:50%;right:-5px;margin-top:-5px;border-right:0;border-left-color:#253d33}
.stroke-badge[data-side=right]:after{top:50%;left:-5px;margin-top:-5px;border-left:0;border-right-color:#253d33}
/* The row and column under the finger or the cursor: cells a little darker, numbers on a ground. */
.board td.cell.hl button:not(.filled):not(.empty){background:#eef3e8}
.board td.cell.hl button.empty{background:#e9efe2}
.board th.row-clue.hl:not(.focus-axis,.correction-axis,.hint-line) .clue-button:not(.clue-error){background:#e7eedf;color:var(--green);border-radius:6px}
.board th.col-clue.hl:not(.focus-axis,.correction-axis,.hint-line) .clue-button:not(.clue-error){color:var(--green);isolation:isolate}
.board th.col-clue.hl:not(.focus-axis,.correction-axis,.hint-line) .clue-button:not(.clue-error):before{content:'';position:absolute;inset:-5px 0;z-index:-1;border-radius:7px;background:#e7eedf}
.board th.hl .clue-button>span.struck{color:#a9b39f}
/* The keyboard cursor: a yellow frame (a green one is a hint's line). */
.board td.cell button.kb-cursor{box-shadow:inset 0 0 0 2.5px #e0a72e;z-index:1}
/* «Кнопка»: the switch ■ ⇄ × by the thumb, the mark in use stands out. */
.mark-switch{position:absolute;right:12px;bottom:12px;z-index:4;width:52px;height:52px;border-radius:50%;background:#fffef9;border:1px solid #e1e5d7;box-shadow:0 8px 20px #3b4f3030;display:flex;align-items:center;justify-content:center;gap:2px;color:#a9b49d;font-weight:800}
.mark-switch[hidden]{display:none}
.mark-switch-cell{width:11px;height:11px;border-radius:2px;background:currentColor}
.mark-switch-arrow{font-size:11px;color:#a9b49d}
.mark-switch-cross{font-size:17px;line-height:1}
.mark-switch[data-mode="1"] .mark-switch-cell,.mark-switch[data-mode="-1"] .mark-switch-cross{color:var(--green)}
.mark-switch[data-mode="1"] .mark-switch-cell{background:var(--green)}
.settings-list>.settings-choice{flex-wrap:wrap;row-gap:10px;cursor:default}
.settings-list>.settings-choice>span:nth-child(2){flex:1 1 calc(100% - 50px)}
.settings-choice .lang-switch{margin-left:50px}
.settings-choice .lang-switch button{min-width:72px}
.settings-keys-list{display:grid;grid-template-columns:1fr auto;gap:9px 10px;margin:0;padding:2px 4px 16px 54px;font-size:13px;color:#5f6b57}
.settings-keys-list[hidden]{display:none}
.settings-keys-list dd{margin:0;text-align:right;white-space:nowrap}
.settings-keys-list kbd{font-family:inherit;font-size:11px;font-weight:650;padding:2px 7px;border-radius:6px;background:#fff;border:1px solid #dcded3;box-shadow:0 1px 0 #dcded3;color:#4f5f47}

/* T06 — уроки приёмов (docs/roadmap/mockups/e13-more, 2.11) */
.learn-inner,.lesson-inner{max-width:560px}
.lesson-inner{min-height:100%}
.learn-note{margin:0;font-size:14px;line-height:1.5;color:#5f6b57}
.learn-progress{display:flex;align-items:center;gap:12px}
.learn-progress>span{flex:1;height:6px;border-radius:999px;background:#e4e9da;overflow:hidden}
.learn-progress i{display:block;height:100%;width:0;border-radius:inherit;background:#9db58d;transition:width .4s ease}
.learn-progress b{font-size:13px;font-variant-numeric:tabular-nums;color:#5f6b57}
.learn-list{display:flex;flex-direction:column;padding:4px 14px;border-radius:16px;background:#fffef9f2;border:1px solid #e1e5d7}
.learn-row{min-height:60px;display:flex;align-items:center;gap:12px;padding:10px 0;color:#30453b}
.learn-row+.learn-row{border-top:1px solid #ebeee3}
.learn-mark{flex:none;width:32px;height:32px;border-radius:50%;display:grid;place-items:center;font-size:13px;font-weight:700;background:#eceee6;color:#a3ad98}
.learn-row.done .learn-mark{background:var(--green);color:#fff}
.learn-row.next .learn-mark{background:#e3eedb;color:var(--green);box-shadow:inset 0 0 0 2px var(--green)}
.learn-text{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.learn-text strong{font-size:14px;font-weight:650}
.learn-text small{font-size:12px;color:#5f6b57}
.learn-row.locked .learn-text strong{color:#65715b}
.learn-row .difficulty-tier{flex:none}
.learn-card{display:flex;align-items:center;gap:14px;padding:14px 16px;border-radius:16px;background:#fffef9f2;border:1px solid #e1e5d7;color:#30453b}
.learn-card-icon{flex:none;width:48px;height:48px;border-radius:14px;display:grid;place-items:center;background:#e3eedb;color:var(--green)}
.learn-card-icon svg{width:24px;height:24px}
.learn-card-text{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.learn-card-text strong{font-size:15px;font-weight:650;line-height:1.3;overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2}
.learn-card-text small{font-size:13px;color:#5f6b57}
.learn-card .today-continue-bar{margin-top:5px}
.learn-card-go{flex:none;font-size:22px;color:#65715b}
@media(min-width:761px){.learn-card{max-width:520px}}
.lesson-bar{display:flex;align-items:center;gap:10px;padding:8px 12px;border-radius:14px;background:#fffef9eb;border:1px solid #e1e5d7}
.lesson-close{flex:none;width:40px;height:40px;display:grid;place-items:center;color:#30453b}
.lesson-close svg{width:22px;height:22px}
.lesson-head{flex:1;min-width:0;display:flex;flex-direction:column}
.lesson-head strong{font-size:15px;font-weight:650;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lesson-head small{font-size:12px;color:#65715b}
.lesson-steps{display:flex;gap:4px;margin-top:-10px}
.lesson-steps i{flex:1;height:4px;border-radius:2px;background:#e4e9da}
.lesson-steps i.done{background:var(--green)}.lesson-steps i.now{background:#9db58d}
.lesson-text{margin:auto 0 0;padding:14px 16px;border-radius:16px;background:#fffef9f2;border:1px solid #e1e5d7;font-size:15px;line-height:1.5;color:#30453b}
.lesson-board-wrap{display:flex;flex-direction:column;align-items:center;gap:8px;padding:8px 0}
.lesson-board{max-width:100%}
.lesson-table{border-collapse:collapse}
.lesson-table th{font-weight:650;color:#4f5f47;font-variant-numeric:tabular-nums}
.lesson-row{padding:0 8px 0 0;text-align:right;white-space:nowrap;font-size:15px}
.lesson-col{vertical-align:bottom;padding:0 0 6px;font-size:14px;line-height:1.2}
.lesson-col span{display:block}
.lesson-table td{padding:0}
.lesson-table td.lesson-split{border-right:2px solid #9aa58f}
.lesson-cell{width:var(--lesson-cell,36px);height:var(--lesson-cell,36px);display:block;border:1px solid #cfd6c4;margin:-.5px;background:#fffef9;position:relative;padding:0}
.lesson-cell.filled{background:var(--green);border-color:var(--green)}
.lesson-cell.crossed:before,.lesson-cell.crossed:after{content:'';position:absolute;left:50%;top:50%;width:46%;height:2px;background:#8a9680;border-radius:1px;transform:translate(-50%,-50%) rotate(45deg)}
.lesson-cell.crossed:after{transform:translate(-50%,-50%) rotate(-45deg)}
.lesson-cell.given{cursor:default}
.lesson-cell.given.filled{background:#4f7a62}
.lesson-cell.focus{box-shadow:inset 0 0 0 3px #d3ad54;z-index:1}
.lesson-cell.wrong{box-shadow:inset 0 0 0 3px #c0503f;z-index:1}
.lesson-legend{font-size:12px;color:#65715b}
.lesson-feedback{display:flex;flex-direction:column;gap:3px;padding:12px 16px;border-radius:16px;font-size:13px;line-height:1.45}
.lesson-feedback[hidden]{display:none}
.lesson-feedback strong{font-size:15px}
.lesson-feedback.right,.lesson-feedback.passed{background:#e3eedb;border:1px solid #cfdfc2;color:#2f5a44}
.lesson-feedback.wrong,.lesson-feedback.missing{background:#faf1dd;border:1px solid #ead9b2;color:#8a6a33}
.lesson-actions{margin-top:auto;display:flex;flex-direction:column;gap:6px}
.lesson-go{width:100%;min-height:50px;border-radius:999px;font-size:15px;font-weight:650;justify-content:center}
.lesson-list-link{align-self:center;min-height:40px;display:inline-flex;align-items:center;padding:0 14px;font-size:14px;font-weight:600;color:var(--green)}
.lesson-list-link[hidden]{display:none}
.hint-lesson{align-self:flex-start;display:inline-flex;align-items:center;min-height:40px;margin:-6px 0 -8px;font-size:13px;font-weight:650;color:var(--green)}
.hint-lesson[hidden]{display:none}
.lesson-cell:disabled{opacity:1;cursor:default}
.board .clue-button{-webkit-touch-callout:none}
/* T20 — шапка на телефоне: переключатель «Авто · Сервер · Устройство» — на экране «Сканер», не в шапке */
.scanner-processing{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:13px;color:#5f6d58}
/* В шапке — только на ноутбуке и без значка «Пикро+»: с ним места нет, переключатель тоже уходит в «Сканер». */
@media(min-width:1100px){.scanner-processing{display:none}body:has(#nav-plus:not([hidden])) .scanner-processing{display:flex}}
@media(max-width:1099px){.topbar .processing-switch{display:none}}
.topbar:has(#nav-plus:not([hidden])) .processing-switch{display:none}
@media(min-width:761px) and (max-width:1099px){.nav-plus{display:none!important}}
@media(min-width:761px) and (max-width:1279px){.topbar{gap:14px}.processing-switch span{display:none}}
@media(min-width:761px) and (max-width:960px){.nav-xp{display:none}.main-nav a{padding-left:11px;padding-right:11px}}
/* T20 — «Сегодня» на телефоне: подписи кнопок серии и рейтинга дня не переносятся по слову */
@media(max-width:760px){
  .today-goal-actions{display:flex;flex-wrap:wrap}
  .today-goal-actions .button{flex:1 1 0;min-width:max-content;padding-left:14px;padding-right:14px;white-space:nowrap}
}
.today-podium-head>span{white-space:nowrap}
#today-podium-title{min-width:0;overflow:hidden;text-overflow:ellipsis}

/* T10 — предположение и мини-картинка (docs/roadmap/mockups/e11-play-tools, 1.8–1.9) */
/* Pencil: thin strokes of the player's green on paper — unlike the broad light stripes of a hint's suggestion. */
.board td.cell button.filled.guess,.board td.cell button.filled.guess:hover:enabled{background:repeating-linear-gradient(45deg,#3f6b4f 0 1.6px,#e3eadf 1.6px 4px)}
.board td.cell button.empty.guess{background:#eef3e8;color:#4f8063}
.board td.cell button.guess-out{animation:guess-out .2s ease-in both}
@keyframes guess-out{to{opacity:0;transform:scale(.6)}}
.guess-bar{display:flex;align-items:center;gap:8px;flex-shrink:0;margin:0 0 8px;padding:6px 6px 6px 12px;border-radius:14px;background:#eef3e8;border:1px dashed #7a9a86;font-size:13px;line-height:1.3;color:#30453b;overflow:hidden;animation:guess-in .25s ease-out}
.guess-bar[hidden]{display:none}
/* The bar opens and closes by its height: the board moves aside smoothly instead of jumping. */
.guess-bar.leaving{animation:guess-out-bar .25s ease-in both}
@keyframes guess-in{from{max-height:0;margin-bottom:0;padding-top:0;padding-bottom:0;border-width:0;opacity:0}to{max-height:64px}}
@keyframes guess-out-bar{from{max-height:64px}to{max-height:0;margin-bottom:0;padding-top:0;padding-bottom:0;border-width:0;opacity:0}}
.guess-bar.nudge{animation:clue-shake .3s ease-in-out}
.guess-swatch{flex:none;width:16px;height:16px;border-radius:4px;background:repeating-linear-gradient(45deg,#3f6b4f 0 1.6px,#e3eadf 1.6px 4px);box-shadow:inset 0 0 0 1px #3f6b4f40}
.guess-text{flex:1;min-width:0}
.guess-text b,.guess-text small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.guess-text b{font-weight:650}
.guess-text small{font-size:12px;color:#5f6d57}
.guess-act{flex:none;min-height:40px;padding:0 14px;border-radius:10px;font-size:13px;font-weight:650;color:var(--green);background:#fffef9;border:1px solid #d7ddcf}
.guess-act.primary{color:#fff;background:var(--green);border-color:var(--green)}
.guess-act[hidden]{display:none}
/* The guess runs into the numbers: the bar turns to the error's red and offers the roll-back. */
.guess-bar.conflict{background:#fbefeb;border:1px solid #efcfc8}
.guess-bar.conflict .guess-swatch{display:grid;place-items:center;border-radius:50%;background:#c0503f;box-shadow:none}
.guess-bar.conflict .guess-swatch:before{content:'!';color:#fff;font-size:11px;font-weight:800;line-height:1}
.guess-bar.conflict .guess-text{color:#8e3b31}
.guess-toggle.active{color:var(--green);background:#eef2e6;box-shadow:inset 0 0 0 1px #c9d6bf}
@media(max-width:600px){
  .guess-bar{margin-bottom:6px;padding-left:10px;font-size:12px}
  .guess-act{padding:0 12px}
  /* On a phone the guess takes the place of the zoom: two fingers zoom, and «Масштаб» is in the settings of the board. */
  .puzzle.playing #zoom-toggle{display:none}
}
/* 40 px to tap, 28 px of room in the bar (as «О картинке» next to it). */
.play-mini{flex:none;position:relative;display:grid;place-items:center;width:40px;height:40px;margin:0 -6px;padding:0;border-radius:8px;color:#3f6b4f}
@media(min-width:1100px){.puzzle.playing .play-mini{margin:0}}
/* On a narrow phone the bar makes room for the picture (30 px there), so the line «Средняя · 25×25» stays whole. */
@media(max-width:400px){.play-bar:has(.play-mini:not([hidden])){gap:8px}.play-bar:has(.play-mini:not([hidden])) .play-timer{padding-left:8px;padding-right:8px}.play-mini{margin:0 -8px}}
.play-mini[hidden]{display:none}
.play-mini canvas{display:block;background:#fffef9;box-shadow:0 0 0 1px #c8d0be;border-radius:1px;transform-origin:top right;transition:transform .25s ease-out,box-shadow .25s}
.play-mini.big{z-index:7}
.play-mini.big canvas{transform:scale(3);box-shadow:0 0 0 .4px #c8d0be,0 4px 10px #3b4f3026}
@media(min-width:1100px){.puzzle.playing .play-mini canvas{transform-origin:top left}.puzzle.playing .play-mini{order:-1}}
.settings-mini-icon{grid-template-columns:repeat(2,9px);gap:2px;place-content:center}
.settings-mini-icon i{width:9px;height:9px;border-radius:1px;background:currentColor}
.settings-mini-icon i:nth-child(2),.settings-mini-icon i:nth-child(3){opacity:.3}
.settings-zoom-icon svg{width:24px;height:24px}
/* T11 — месяц головоломки дня, архив, трофеи, статистика (docs/roadmap/mockups/e12-habit 2.5, e13-more 5.1–5.2) */
.daily-month{display:flex;flex-direction:column;gap:10px;padding:12px 14px 14px;border-radius:16px;background:#fffef9f2;border:1px solid #e1e5d7}
.daily-month-head{display:grid;grid-template-columns:40px minmax(0,1fr) 40px;align-items:center;gap:4px}
.daily-month-heading{display:flex;flex-direction:column;align-items:center;gap:2px;text-align:center;min-width:0}
.daily-month-heading b{font-size:16px;font-weight:650;color:#253d33}
.daily-month-heading small{font-size:12px;color:#5f6b57}
.daily-month-step{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;color:#5f6b57;transition:background .2s}
.daily-month-step:hover{background:#f1f4ea}
.daily-month-step svg{width:20px;height:20px}
.daily-month-body{display:flex;flex-direction:column;gap:12px}
.daily-month-days{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:4px}
.daily-month-weekday{font-size:11px;font-weight:600;color:#5f6b57;text-align:center;padding-bottom:2px}
.daily-month-day{position:relative;aspect-ratio:1;min-height:40px;border-radius:10px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;background:#eceee6;color:#4c5a45;font-size:13px;font-weight:650;font-variant-numeric:tabular-nums;transition:filter .2s}
.daily-month-day b{position:relative;z-index:1;font-weight:inherit}
button.daily-month-day:hover{filter:brightness(.96)}
button.daily-month-day:focus-visible{outline:2px solid var(--green);outline-offset:2px}
.daily-month-day.ok{background:var(--green);color:#fff}
.daily-month-day.late{background:#b9c8a6;color:#24402f}
.daily-month-day.part{background:conic-gradient(#7f9670 var(--p,30%),#dfe4d6 0)}
.daily-month-day.part:before{content:'';position:absolute;inset:3px;border-radius:7px;background:#fffef9}
.daily-month-day.today{box-shadow:0 0 0 2px #fffef9,0 0 0 4px #d39a24}
.daily-month-day.locked{background:#f1f2ec;color:#6f7a66}
.daily-month-day.locked svg{width:11px;height:11px}
.daily-month-day.idle{background:none;color:#687360;font-weight:500}
.daily-month-art{display:flex;align-items:center;gap:12px}
.daily-month-picture{flex:none;width:64px;aspect-ratio:1;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));border-radius:10px;overflow:hidden;background:var(--paper,#f6efe2);box-shadow:inset 0 0 0 1px #0000000d}
.daily-month-picture i{display:block;transition:background .3s}
.daily-month-picture i.closed{background:#e6e9df}
.daily-month-art-text{display:flex;flex-direction:column;gap:2px;min-width:0}
.daily-month-art-text b{font-size:13px;font-weight:650;color:#253d33}
.daily-month-art-text small{font-size:12px;line-height:1.35;color:#5f6b57}
.daily-month-legend{display:flex;flex-wrap:wrap;gap:6px 14px;font-size:11px;color:#5f6b57}
.daily-month-legend span{display:inline-flex;align-items:center;gap:5px}
.daily-month-legend span[hidden]{display:none}
.daily-month-legend span:before{content:'';width:10px;height:10px;border-radius:3px;box-sizing:border-box}
.daily-month-legend .ok:before{background:var(--green)}
.daily-month-legend .late:before{background:#b9c8a6}
.daily-month-legend .part:before{border:2px solid #7f9670;border-right-color:#dfe4d6;border-radius:50%}
.daily-month-legend .locked:before{background:#f1f2ec;border:1px solid #d5dacb}
.daily-archive-plus{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:16px;background:#fffef9f2;border:1px solid #e1e5d7}
.daily-archive-plus[hidden]{display:none}
.daily-archive-plus-text{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.daily-archive-plus-text b{font-size:14px;font-weight:650;color:#253d33}
.daily-archive-plus-text small{font-size:12px;line-height:1.35;color:#5f6b57}
.daily-archive-plus .button{flex:none;min-height:40px;padding:0 18px;border-radius:999px}
@media(max-width:379px){.daily-month{padding:12px 12px 14px}.daily-month-days{gap:3px}}
@media(min-width:1100px){
  .daily-month-body{flex-direction:row;align-items:flex-start;gap:18px}
  .daily-month-days{flex:1}
  .daily-month-art{flex:none;width:136px;flex-direction:column;align-items:stretch;text-align:center;margin-top:20px}
  .daily-month-picture{width:136px}
}
.account-trophies{display:flex;flex-direction:column;gap:8px}
.account-trophies[hidden]{display:none}
.account-trophies-list{display:grid;grid-template-columns:minmax(0,1fr);gap:8px}
.account-trophy{display:flex;align-items:center;gap:12px;padding:10px 14px 10px 10px;min-height:60px;border-radius:16px;background:#fffef9f2;border:1px solid #e1e5d7;color:inherit;text-decoration:none}
.account-trophy .daily-month-picture{width:52px;border-radius:8px}
.account-trophy:not(.done) .daily-month-picture{opacity:.9}
.account-trophy-text{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.account-trophy-text b{font-size:14px;font-weight:650;color:#253d33}
.account-trophy-text small{font-size:12px;line-height:1.35;color:#5f6b57}
.account-trophy.done .account-trophy-text b:before{content:'🏆 '}
@media(min-width:1100px){
  .account>.account-friends,.account>.account-trophies{grid-column:1}
  .account-trophies-list{grid-template-columns:repeat(2,minmax(0,1fr))}
}
.stats-inner{max-width:560px}
.stats-tiles{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.stats-tile{display:flex;flex-direction:column;gap:2px;padding:12px 14px;border-radius:16px;background:#fffef9f2;border:1px solid #e1e5d7}
.stats-tile b{display:flex;align-items:center;gap:4px;font-size:22px;font-weight:750;color:#253d33;font-variant-numeric:tabular-nums}
.stats-tile b.hot{color:#a8641a}
.stats-tile b svg{width:20px;height:20px;fill:#d08a2e}
.stats-tile small{font-size:12px;color:#5f6b57}
.stats-card{display:flex;flex-direction:column;gap:10px;padding:14px;border-radius:16px;background:#fffef9f2;border:1px solid #e1e5d7}
.stats-card>b,.stats-times-head b{font-size:15px;font-weight:650;color:#253d33}
.stats-times-head{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px}
.stats-sizes button{padding:6px 9px;font-size:12px;font-variant-numeric:tabular-nums}
.stats-bars{display:flex;align-items:flex-end;gap:6px;height:110px}
.stats-bars i{flex:1;background:#dfe7d6;border-radius:4px 4px 0 0;transition:height .3s}
.stats-bars i.you{background:var(--green)}
.stats-labels{display:flex;gap:6px;margin-top:-4px}
.stats-labels span{flex:1;min-width:0;text-align:center;font-size:10px;color:#5f6b57;font-variant-numeric:tabular-nums;white-space:nowrap}
.stats-labels span.you{color:var(--green);font-weight:700}
.stats-note{font-size:12px;line-height:1.4;color:#46594d}
.stats-daily-facts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));text-align:center}
.stats-daily-facts strong{display:block;font-size:20px;color:#253d33;font-variant-numeric:tabular-nums}
.stats-daily-facts span{font-size:11px;color:#5f6b57}
.stats-daily-go{align-self:flex-start;min-height:40px;display:inline-flex;align-items:center;padding:0 18px;border-radius:999px}
@media(min-width:1100px){
  .stats-inner{max-width:1040px;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:16px 28px;align-items:stretch}
  .stats-inner>.print-head,.stats-inner>.stats-tiles{grid-column:1/-1}
  .stats-tiles{grid-template-columns:repeat(4,minmax(0,1fr))}
}
@media(prefers-reduced-motion:reduce){.daily-month-picture i,.stats-bars i,.daily-month-day,.daily-month-step{transition:none}}
.stats-bars[hidden],.stats-labels[hidden]{display:none}
/* T12 — задания дня и недели, двойной XP (docs/roadmap/mockups/e12-habit, 2.7, 5.9) */
.today-quests{border-radius:18px;background:#fffef9f2;border:1px solid #e1e5d7;color:#30453b}
.today-quests-bar{display:flex;align-items:center;gap:12px;width:100%;min-height:52px;padding:12px 18px;border-radius:18px;text-align:left;font:inherit;color:inherit}
.today-quests-eyebrow{font-size:10px;font-weight:700;letter-spacing:1.6px;text-transform:uppercase;color:#65715b;white-space:nowrap}
.today-quests-dots{display:flex;gap:5px}
.today-quests-dots i{width:8px;height:8px;border-radius:50%;background:#e4e9da}
.today-quests-dots i.on{background:var(--green)}
.today-quests-count{margin-left:auto;font-size:13px;font-weight:650;color:#5f6b57;font-variant-numeric:tabular-nums;white-space:nowrap}
.today-quests-count.boost{padding:3px 10px;border-radius:999px;background:#f6e2ae;color:#6b4a0e}
.today-quests-chevron{width:20px;height:20px;flex:none;color:#65715b;transition:transform .25s ease}
.today-quests.open .today-quests-chevron{transform:rotate(180deg)}
.today-quests-body{display:flex;flex-direction:column;gap:12px;margin:0 18px;padding:4px 0 16px;border-top:1px solid #ebeee3}
.quest-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column}
.quest{display:flex;align-items:center;gap:12px;padding:10px 0}
.quest+.quest{border-top:1px solid #ebeee3}
.quest-icon{flex:none;width:36px;height:36px;border-radius:10px;display:grid;place-items:center;background:#f3f5ec;color:var(--green);font-size:15px;font-weight:700}
.quest-icon svg{width:20px;height:20px;fill:#d08a2e}
.quest.done .quest-icon{background:#e3eedb}
.quest-text{flex:1;min-width:0;display:flex;flex-direction:column;gap:6px}
.quest-text b{font-size:14px;font-weight:600;line-height:1.3}
.quest.done .quest-text b{color:#5f6b57;font-weight:500}
.quest-bar{height:6px;border-radius:999px;background:#e9ecdf;overflow:hidden}
.quest-bar i{display:block;height:100%;border-radius:inherit;background:var(--green);transition:width .4s ease}
.quest.week .quest-bar i{background:#d08a2e}
.quest-reward{flex:none;font-size:13px;font-weight:650;color:#8a5d14;white-space:nowrap;font-variant-numeric:tabular-nums}
.quest.done .quest-reward{color:#65715b;font-weight:500}
.today-quests-foot{display:flex;justify-content:space-between;flex-wrap:wrap;gap:4px 12px;margin:0;font-size:12px;color:#5f6b57}
.today-quests-week{display:flex;flex-direction:column;gap:2px;padding-top:12px;border-top:1px solid #ebeee3}
.today-quests-head{display:flex;justify-content:space-between;align-items:baseline;gap:12px}
.today-quests-head small{font-size:12px;color:#5f6b57}
@media(min-width:761px){
  .today-quests-bar{padding:12px 22px}.today-quests-body{margin:0 22px;padding-bottom:18px}
  #today-quests-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:24px}
  #today-quests-list .quest{border-top:0}
}
.nav-boost{background:#f6e2ae;color:#6b4a0e;font-variant-numeric:tabular-nums}
.nav-boost b{font-weight:800}
/* На телефоне и планшете — коротко «×2 11:42»; место в шапке — за счёт переключателя и языка. */
@media(max-width:1279px){.nav-boost-xp{display:none}}
.topbar:has(#nav-boost:not([hidden])) .processing-switch{display:none}
@media(min-width:1100px){body:has(#nav-boost:not([hidden])) .scanner-processing{display:flex}}
@media(min-width:761px) and (max-width:1099px){.topbar:has(#nav-boost:not([hidden])) .nav-lang{display:none}.topbar:has(#nav-boost:not([hidden])) #nav-boost{margin-left:auto}}
@media(max-width:960px){.topbar:has(#nav-boost:not([hidden])) .app-version{display:none}}
@media(min-width:761px) and (max-width:960px){.topbar:has(#nav-boost:not([hidden])){gap:12px}}
/* T16 — оформления поля как награды (docs/roadmap/mockups/e13-more, раздел 3): палитра — переменные --board-*, их ставит app.js */
html[data-board] .board-sheet{background:var(--board-sheet)}
html[data-board] .board .cell{background:var(--board-paper);border-color:var(--board-line)}
html[data-board] .board .cell.major-right{border-right-color:var(--board-major)}
html[data-board] .board tr.major-bottom .cell{border-bottom-color:var(--board-major)}
html[data-board] .board tr:nth-child(2) .cell{border-top-color:var(--board-major)}
html[data-board] .board .cell:first-of-type{border-left-color:var(--board-major)}
/* Only the plain marks (:where keeps the weight of the old rule): an error, a fixed cell, a mark from paper, a guess keep their own colours. */
html[data-board] .cell button.filled:where(:not(.correction-target,.fixed,.paper-mark,.guess,.ambiguous)),html[data-board] .cell button.filled:where(:not(.correction-target,.fixed,.paper-mark,.guess,.ambiguous)):hover:enabled{background:var(--board-fill)}
html[data-board] .cell button.empty:where(:not(.correction-target,.fixed,.paper-mark,.guess,.auto-cross)){background:var(--board-crossBg);color:var(--board-cross)}
html[data-board] .board th{color:var(--board-ink)}
.board-themes h2{margin:0;font-family:Georgia,"Times New Roman",serif;font-weight:400;font-size:24px;color:#253d33}
.board-themes-lead{margin:-6px 0 0;font-size:13px;line-height:1.4;color:#5f6b57}
.board-themes-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.board-theme{display:flex;flex-direction:column;align-items:center;gap:2px;padding:8px 6px 9px;border-radius:14px;background:#fffef9;border:1px solid #e1e5d7;text-align:center;color:inherit;transition:box-shadow .2s}
.board-theme.on{box-shadow:0 0 0 2px var(--green);border-color:transparent}
button.board-theme:focus-visible{outline:2px solid var(--green);outline-offset:2px}
.board-theme b{margin-top:5px;font-size:13px;font-weight:650;color:#253d33}
.board-theme small{display:block;font-size:11px;line-height:1.3;color:#5f6b57;text-wrap:balance}
.board-theme small svg{width:11px;height:11px;margin-right:3px;vertical-align:-1px}
.board-theme.on small{color:var(--green);font-weight:650}
.board-theme.locked .board-theme-swatch{filter:saturate(.35);opacity:.55}
.board-theme-swatch{width:100%;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:2px;padding:6px;border-radius:10px;border:1px solid}
.board-theme-swatch i{position:relative;aspect-ratio:1;border-radius:2px}
.board-theme-swatch i.x:before,.board-theme-swatch i.x:after{content:'';position:absolute;left:50%;top:50%;width:56%;height:1.5px;border-radius:1px;background:currentColor;transform:translate(-50%,-50%) rotate(45deg)}
.board-theme-swatch i.x:after{transform:translate(-50%,-50%) rotate(-45deg)}
.board-themes-night{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:16px;background:#fffef9f2;border:1px solid #e1e5d7}
.board-themes-night-icon{flex:none;width:36px;height:36px;border-radius:12px;background:#e3eedb;color:var(--green);display:grid;place-items:center}
.board-themes-night-icon svg{width:20px;height:20px}
.board-themes-night-text{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.board-themes-night-text b{font-size:14px;font-weight:650;color:#253d33}
.board-themes-night-text small{font-size:12px;line-height:1.35;color:#5f6b57}
.board-themes-night .button{flex:none;min-height:40px;padding:0 16px;border-radius:999px}
.settings-board-row{width:100%;padding:0;text-align:left;color:inherit;font:inherit;font-size:14px}
.settings-board-row strong{margin-left:auto;color:#253d33}
.settings-board-go{flex:none;width:16px;height:16px;margin-left:-6px;color:#9ea994}
.settings-board-icon{display:grid!important;grid-template-columns:repeat(2,9px);gap:2px;place-content:center}
.settings-board-icon i{width:9px;height:9px;border-radius:1px;background:currentColor}
.settings-board-icon i:nth-child(2),.settings-board-icon i:nth-child(3){opacity:.3}
@media(max-width:379px){.board-themes-list{gap:6px}.board-theme{padding:7px 5px 8px}}
@media(prefers-reduced-motion:reduce){.board-theme{transition:none}}

/* T15 — режим одной линии (docs/roadmap/mockups/e13-more, 5.3) */
.line-strip{flex-shrink:0;display:flex;flex-direction:column;gap:6px;padding:6px;border-radius:18px;background:#fffef9;border:1px solid #e1e5d7;box-shadow:0 -4px 14px #3b4f3010;animation:line-in .25s ease-out}
.line-strip[hidden]{display:none}
@keyframes line-in{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.line-strip-head{display:flex;align-items:center;gap:4px}
.line-step{flex:none;width:44px;height:40px;border-radius:12px;display:grid;place-items:center;font-size:24px;line-height:1;color:#5f6d57;background:#f3f5ec}
.line-step:disabled{opacity:.35}
.line-close{font-size:22px;background:none}
.line-title{flex:1;min-width:0;display:flex;align-items:center;justify-content:center;gap:8px}
.line-name{font-size:12px;color:#5f6d57;white-space:nowrap}
/* The numbers of the line, as the mockup's pill: struck ones paler and crossed, contradicted ones on red. */
.line-clues{display:flex;gap:.45em;min-width:0;padding:4px 9px;border-radius:8px;background:var(--green);color:#fff;font-size:15px;font-weight:750;font-variant-numeric:tabular-nums;white-space:nowrap;overflow:hidden}
.line-clues span.struck{opacity:.5;text-decoration:line-through}
.line-strip.tight .line-name{display:none}
.line-strip.tighter .line-clues{font-size:12px;gap:.4em;padding:4px 7px}
.line-clues.error{background:#c0503f}
.line-cells{display:flex;justify-content:center;touch-action:none;user-select:none}
.line-board{--clue:12px}
.line-board .cell{height:34px}
.line-board .cell button{height:33px}
.line-board .cell{border-top:2px solid #8f9e80;border-bottom:2px solid #8f9e80}
.line-board .cell:last-child{border-right:2px solid #8f9e80}
/* The strip's cells are tall and narrow: a cross as wide as the cell, not as its 46 %. */
.line-board .cell button.empty:before,.line-board .cell button.empty:after{width:min(80%,16px);height:2px}
/* The chosen line on the board: the ground of T02's highlight, which stays while the strip is open. */
.board td.cell.line-on button:not(.filled):not(.empty){background:#eef3e8}
.board td.cell.line-on button.empty{background:#e9efe2}
.board th.row-clue.line-on:not(.focus-axis,.correction-axis,.hint-line) .clue-button:not(.clue-error){background:#e7eedf;color:var(--green);border-radius:6px}
.board th.col-clue.line-on:not(.focus-axis,.correction-axis,.hint-line) .clue-button:not(.clue-error){color:var(--green);isolation:isolate}
.board th.col-clue.line-on:not(.focus-axis,.correction-axis,.hint-line) .clue-button:not(.clue-error):before{content:'';position:absolute;inset:-5px 0;z-index:-1;border-radius:7px;background:#e7eedf}
.zoom-menu .zoom-line{min-width:72px;font-size:12px;font-weight:650;color:var(--green)}
.zoom-menu .zoom-line[aria-pressed=true]{background:#eef2e6}
/* T14 — сезонные события (docs/roadmap/mockups/e12-habit, 2.6) */
.today-event{position:relative;display:flex;flex-direction:column;gap:12px;padding:16px 18px;border-radius:18px;background:linear-gradient(135deg,#fff3e2,#fffef9);border:1px solid #efd9b8;color:#3d2f20;min-width:0}
.today-event-link{display:flex;flex-direction:column;gap:4px;color:inherit;text-decoration:none}
.today-event-link:after{content:'';position:absolute;inset:0;border-radius:inherit}
.today-event-link:focus-visible{outline:none}.today-event:has(.today-event-link:focus-visible){outline:2px solid var(--green);outline-offset:2px}
.today-event-top{display:flex;justify-content:space-between;align-items:baseline;gap:12px}
.today-event-eyebrow{font-size:10px;font-weight:700;letter-spacing:1.6px;text-transform:uppercase;color:#8f5a17;white-space:nowrap}
.today-event-top small{font-size:13px;font-weight:650;color:#6b5a44;font-variant-numeric:tabular-nums}
.today-event-link strong{font-size:17px;font-weight:700;line-height:1.3}
.today-event-cards{display:flex;gap:8px;overflow:hidden}
.event-postcard{flex:none;width:44px;height:44px;border-radius:10px;display:grid;place-items:center;background:#f6ead8;border:1px dashed #e2c9a4;color:#b0895a;font-size:16px;font-weight:700}
.event-postcard.got{background:#fffef9;border:1px solid #efd9b8}
.event-postcard svg{width:70%;height:70%}
.today-event-go{position:relative;z-index:1;min-height:44px;margin:0;border-radius:999px;font-size:14px;font-weight:650;justify-content:center}
.event-header{background:linear-gradient(135deg,#fff3e2,#f7efe2)}
.event-header .pack-progress i{background:#d08a2e}
.event-tile-size{font-size:15px;font-weight:650;font-variant-numeric:tabular-nums}
.event-tile-lock{display:grid;place-items:center;width:22px;height:22px}
.event-tile-lock svg{width:20px;height:20px}
.pack-tile.event-tile.locked{gap:5px}
/* T18 — большая картина из нескольких полей (docs/roadmap/mockups/e13-more, 5.6) */
.picture-body{display:flex;flex-direction:column;gap:14px}
.picture-mosaic{display:grid;grid-template-columns:repeat(var(--cols,3),minmax(0,1fr));gap:4px;padding:4px;border-radius:16px;border:1px solid #e1e5d7;background:var(--paper,#eef2e4);width:100%;max-width:560px;margin:0 auto;box-sizing:border-box}
.picture-piece{position:relative;aspect-ratio:1;min-height:40px;border-radius:8px;display:grid;place-items:center;overflow:hidden;padding:0;font:inherit;color:#65715b;background:#eceee6}
.picture-piece.solved{background:var(--paper,#eef2e4)}
/* Dark: a dark frame, the solved pieces keep the pack's paper dimmed, as the covers of packs. */
html[data-theme=dark] .picture-mosaic{background:#1d2520}
html[data-theme=dark] .picture-piece.solved{filter:brightness(.8) saturate(.9)}
.picture-piece.next{background:#fffef9;color:var(--green);box-shadow:inset 0 0 0 3px var(--green)}
.picture-piece-art{position:absolute;inset:0;width:100%;height:100%}
.picture-piece-art.begun{opacity:.35}
.picture-piece-number{position:relative;font-family:Georgia,serif;font-size:24px}
button.picture-piece:focus-visible{outline:2px solid var(--green);outline-offset:2px}
button.picture-piece:not(.solved):hover{filter:brightness(.97)}
.picture-next{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:16px;background:#fffef9f2;border:1px solid #e1e5d7;width:100%;max-width:560px;margin:0 auto;box-sizing:border-box}
.picture-next-text{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.picture-next-text b{font-size:15px;font-weight:650;color:#253d33}
.picture-next-text small{font-size:12px;line-height:1.35;color:#5f6b57;text-wrap:balance}
.picture-next-go{flex:none;min-height:44px;padding:0 20px;border-radius:999px;display:inline-flex;align-items:center}
@media(min-width:1100px){
  .picture-body{display:grid;grid-template-columns:minmax(0,560px) 320px;justify-content:start;align-items:start;gap:24px}
  .picture-mosaic,.picture-next{margin:0}
  .picture-next{flex-direction:column;align-items:stretch;text-align:left;padding:18px}
  .picture-next-go{justify-content:center}
}
.complete-picture.big{gap:0;width:min(260px,70vw);padding:10px}
.complete-picture.big i{display:block;aspect-ratio:1;border-radius:0;background:transparent}
.complete-picture.big svg{display:block;width:100%;height:100%;shape-rendering:crispEdges}
.complete-credit{width:100%;max-width:360px}
.complete-credit[hidden]{display:none}
@media(prefers-reduced-motion:reduce){button.picture-piece{transition:none}}
/* T03 — крестик программы снят: линия больше не готова, освободившаяся клетка коротко вспыхивает */
.board td.cell button.cross-gone{animation:cross-gone .35s ease-out both}
@keyframes cross-gone{from{box-shadow:inset 0 0 0 99px rgba(127,145,110,.28)}to{box-shadow:inset 0 0 0 99px rgba(127,145,110,0)}}
/* T17 — турнир выходных (docs/roadmap/mockups/e13-more, 5.5) */
.today-tournament-note{font-size:13px;line-height:1.4;color:#6b5a44}
.today-tournament .today-event-eyebrow{white-space:normal}
.tournament-inner{max-width:520px;display:flex;flex-direction:column;gap:14px}
.tournament-hero{display:flex;flex-direction:column;gap:8px;padding:16px 18px;border-radius:18px;background:linear-gradient(135deg,#fff3e2,#fffef9);border:1px solid #efd9b8;color:#3d2f20}
.tournament-brow{font-size:10px;font-weight:700;letter-spacing:1.6px;text-transform:uppercase;color:#8f5a17}
.tournament-hero-title{font-size:17px;font-weight:700;line-height:1.3}
.tournament-scale{display:flex;flex-wrap:wrap;align-items:center;gap:6px 14px;font-size:12px;font-weight:650;color:#6b5a44;font-variant-numeric:tabular-nums}
.tournament-scale>span{display:inline-flex;align-items:center;gap:6px}
.tournament-scale .difficulty-tier i.on{background:#b0702a}
.tournament-text{margin:0;font-size:14px;line-height:1.5}
.tournament-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:4px}
.tournament-actions .button{border-radius:999px;min-height:44px;padding:11px 18px;font-size:14px;justify-content:center}
.tournament-player{min-height:40px}
.tournament-who{flex:1;min-width:0;display:flex;flex-direction:column}
.tournament-who small{font-size:12px;color:#65715b;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tournament-points{font-size:15px;font-weight:700;color:#4f5f47;font-variant-numeric:tabular-nums}
.tournament-board-note{padding:8px 0 6px;font-size:12px;line-height:1.4;color:#65715b}
.tournament-note{font-size:12px;line-height:1.4;color:#65715b}
.tournament-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(88px,1fr));gap:8px}
.tournament-tile{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;min-height:72px;padding:8px 4px;border-radius:12px;background:#fffef9;border:1px solid #e1e5d7;color:#30453b;font:inherit;cursor:pointer}
button.tournament-tile:hover{border-color:#b9c9ac}
.tournament-tile.current{border:1.5px solid var(--green)}
.tournament-tile.solved{background:#eef4e8;border-color:#cfe0c4}
.tournament-tile-size{font-size:14px;font-weight:650;font-variant-numeric:tabular-nums}
.tournament-tile-points{font-size:12px;color:#65715b;font-variant-numeric:tabular-nums}
.tournament-tile.solved .tournament-tile-points{color:#2f6a4b;font-weight:700}
@media(min-width:1100px){
  .tournament-inner{max-width:980px;display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:14px 32px;align-items:start}
  .tournament-inner>*{grid-column:1}
  .tournament-inner>.print-head{grid-column:1/-1}
  .tournament-inner>.tournament-side{grid-column:2;grid-row:2/span 6}
}
.tournament-side{display:flex;flex-direction:column;gap:14px}
/* T22 — tap targets of at least 40 px on a phone (AGENTS.md, «Мелочи») */
@media (max-width:760px){
  .band-all{display:inline-flex;align-items:center;min-height:40px;padding:0 0 0 14px}
  .guest-later,.lock-card-close,.login-skip{display:inline-flex;align-items:center;justify-content:center;min-height:40px}
  .print-modes button{min-height:40px}
  .notification-close{position:relative}
  .notification-close::after{content:'';position:absolute;inset:-7px}
}
/* T22 — a message from the admin page on «Сегодня» (as .sets-note, a quiet card) */
.today .sets-note.announce{background:#fffef9;border:1px solid #e1e5d7;color:#30453b;padding:6px 6px 6px 14px}
.sets-note .announce-icon{flex:none;width:32px;height:32px;border-radius:10px;display:grid;place-items:center;background:#e3eedb;color:var(--green)}
.announce-icon svg{width:18px;height:18px}
/* T22 — a pack on a laptop: larger tiles fill the column beside the surprise picture instead of a thin strip */
@media(min-width:1100px){
  .pack-grid{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:14px}
  .pack-tile-number{font-size:34px}
}
/* T19 — цветные нонограммы (docs/roadmap/mockups/e13-more, 5.4): клетки, числа-фишки, палитра в доке */
:root{--color-guess-paper:#eef2e8}
html[data-theme=dark]{--color-guess-paper:#202923}
.board td.cell button.filled.pc1:where(:not(.correction-target,.guess)),.board td.cell button.filled.pc1:where(:not(.correction-target,.guess)):hover:enabled{background:var(--pc1)}
.board td.cell button.filled.guess.pc1{background:repeating-linear-gradient(45deg,var(--pc1) 0 1.8px,var(--color-guess-paper) 1.8px 4px)}
.board td.cell button.suggest-fill.sg1:not(.filled){background:repeating-linear-gradient(135deg,var(--pc1) 0 3px,var(--color-guess-paper) 3px 6px)}
.color-chip.pc1,.color-swatch.pc1{--chip:var(--pc1);--chip-ink:var(--pc1-ink)}
.board td.cell button.filled.pc2:where(:not(.correction-target,.guess)),.board td.cell button.filled.pc2:where(:not(.correction-target,.guess)):hover:enabled{background:var(--pc2)}
.board td.cell button.filled.guess.pc2{background:repeating-linear-gradient(45deg,var(--pc2) 0 1.8px,var(--color-guess-paper) 1.8px 4px)}
.board td.cell button.suggest-fill.sg2:not(.filled){background:repeating-linear-gradient(135deg,var(--pc2) 0 3px,var(--color-guess-paper) 3px 6px)}
.color-chip.pc2,.color-swatch.pc2{--chip:var(--pc2);--chip-ink:var(--pc2-ink)}
.board td.cell button.filled.pc3:where(:not(.correction-target,.guess)),.board td.cell button.filled.pc3:where(:not(.correction-target,.guess)):hover:enabled{background:var(--pc3)}
.board td.cell button.filled.guess.pc3{background:repeating-linear-gradient(45deg,var(--pc3) 0 1.8px,var(--color-guess-paper) 1.8px 4px)}
.board td.cell button.suggest-fill.sg3:not(.filled){background:repeating-linear-gradient(135deg,var(--pc3) 0 3px,var(--color-guess-paper) 3px 6px)}
.color-chip.pc3,.color-swatch.pc3{--chip:var(--pc3);--chip-ink:var(--pc3-ink)}
.board td.cell button.filled.pc4:where(:not(.correction-target,.guess)),.board td.cell button.filled.pc4:where(:not(.correction-target,.guess)):hover:enabled{background:var(--pc4)}
.board td.cell button.filled.guess.pc4{background:repeating-linear-gradient(45deg,var(--pc4) 0 1.8px,var(--color-guess-paper) 1.8px 4px)}
.board td.cell button.suggest-fill.sg4:not(.filled){background:repeating-linear-gradient(135deg,var(--pc4) 0 3px,var(--color-guess-paper) 3px 6px)}
.color-chip.pc4,.color-swatch.pc4{--chip:var(--pc4);--chip-ink:var(--pc4-ink)}
.board td.cell button.filled.pc5:where(:not(.correction-target,.guess)),.board td.cell button.filled.pc5:where(:not(.correction-target,.guess)):hover:enabled{background:var(--pc5)}
.board td.cell button.filled.guess.pc5{background:repeating-linear-gradient(45deg,var(--pc5) 0 1.8px,var(--color-guess-paper) 1.8px 4px)}
.board td.cell button.suggest-fill.sg5:not(.filled){background:repeating-linear-gradient(135deg,var(--pc5) 0 3px,var(--color-guess-paper) 3px 6px)}
.color-chip.pc5,.color-swatch.pc5{--chip:var(--pc5);--chip-ink:var(--pc5-ink)}
.board td.cell button.filled.pc6:where(:not(.correction-target,.guess)),.board td.cell button.filled.pc6:where(:not(.correction-target,.guess)):hover:enabled{background:var(--pc6)}
.board td.cell button.filled.guess.pc6{background:repeating-linear-gradient(45deg,var(--pc6) 0 1.8px,var(--color-guess-paper) 1.8px 4px)}
.board td.cell button.suggest-fill.sg6:not(.filled){background:repeating-linear-gradient(135deg,var(--pc6) 0 3px,var(--color-guess-paper) 3px 6px)}
.color-chip.pc6,.color-swatch.pc6{--chip:var(--pc6);--chip-ink:var(--pc6-ink)}
.board td.cell button.filled.pc7:where(:not(.correction-target,.guess)),.board td.cell button.filled.pc7:where(:not(.correction-target,.guess)):hover:enabled{background:var(--pc7)}
.board td.cell button.filled.guess.pc7{background:repeating-linear-gradient(45deg,var(--pc7) 0 1.8px,var(--color-guess-paper) 1.8px 4px)}
.board td.cell button.suggest-fill.sg7:not(.filled){background:repeating-linear-gradient(135deg,var(--pc7) 0 3px,var(--color-guess-paper) 3px 6px)}
.color-chip.pc7,.color-swatch.pc7{--chip:var(--pc7);--chip-ink:var(--pc7-ink)}
.board td.cell button.filled.pc8:where(:not(.correction-target,.guess)),.board td.cell button.filled.pc8:where(:not(.correction-target,.guess)):hover:enabled{background:var(--pc8)}
.board td.cell button.filled.guess.pc8{background:repeating-linear-gradient(45deg,var(--pc8) 0 1.8px,var(--color-guess-paper) 1.8px 4px)}
.board td.cell button.suggest-fill.sg8:not(.filled){background:repeating-linear-gradient(135deg,var(--pc8) 0 3px,var(--color-guess-paper) 3px 6px)}
.color-chip.pc8,.color-swatch.pc8{--chip:var(--pc8);--chip-ink:var(--pc8-ink)}
.board td.cell button.filled.pc9:where(:not(.correction-target,.guess)),.board td.cell button.filled.pc9:where(:not(.correction-target,.guess)):hover:enabled{background:var(--pc9)}
.board td.cell button.filled.guess.pc9{background:repeating-linear-gradient(45deg,var(--pc9) 0 1.8px,var(--color-guess-paper) 1.8px 4px)}
.board td.cell button.suggest-fill.sg9:not(.filled){background:repeating-linear-gradient(135deg,var(--pc9) 0 3px,var(--color-guess-paper) 3px 6px)}
.color-chip.pc9,.color-swatch.pc9{--chip:var(--pc9);--chip-ink:var(--pc9-ink)}
.board td.cell button.filled.pc10:where(:not(.correction-target,.guess)),.board td.cell button.filled.pc10:where(:not(.correction-target,.guess)):hover:enabled{background:var(--pc10)}
.board td.cell button.filled.guess.pc10{background:repeating-linear-gradient(45deg,var(--pc10) 0 1.8px,var(--color-guess-paper) 1.8px 4px)}
.board td.cell button.suggest-fill.sg10:not(.filled){background:repeating-linear-gradient(135deg,var(--pc10) 0 3px,var(--color-guess-paper) 3px 6px)}
.color-chip.pc10,.color-swatch.pc10{--chip:var(--pc10);--chip-ink:var(--pc10-ink)}
.board td.cell button.filled.pc11:where(:not(.correction-target,.guess)),.board td.cell button.filled.pc11:where(:not(.correction-target,.guess)):hover:enabled{background:var(--pc11)}
.board td.cell button.filled.guess.pc11{background:repeating-linear-gradient(45deg,var(--pc11) 0 1.8px,var(--color-guess-paper) 1.8px 4px)}
.board td.cell button.suggest-fill.sg11:not(.filled){background:repeating-linear-gradient(135deg,var(--pc11) 0 3px,var(--color-guess-paper) 3px 6px)}
.color-chip.pc11,.color-swatch.pc11{--chip:var(--pc11);--chip-ink:var(--pc11-ink)}
.board td.cell button.filled.pc12:where(:not(.correction-target,.guess)),.board td.cell button.filled.pc12:where(:not(.correction-target,.guess)):hover:enabled{background:var(--pc12)}
.board td.cell button.filled.guess.pc12{background:repeating-linear-gradient(45deg,var(--pc12) 0 1.8px,var(--color-guess-paper) 1.8px 4px)}
.board td.cell button.suggest-fill.sg12:not(.filled){background:repeating-linear-gradient(135deg,var(--pc12) 0 3px,var(--color-guess-paper) 3px 6px)}
.color-chip.pc12,.color-swatch.pc12{--chip:var(--pc12);--chip-ink:var(--pc12-ink)}
.board td.cell button.fixed.filled[class*=" pc"]{box-shadow:inset 0 0 0 max(2px,calc(var(--cell)*.12)) #7c3a31}
.board th .clue-button span.color-chip,.line-clues span.color-chip{display:inline-grid;place-items:center;min-width:1.3em;padding:0 .2em;border-radius:max(2px,calc(var(--cell)*.12));line-height:1.3;background:var(--chip);color:var(--chip-ink);font-weight:700}
.board th.row-clue .clue-button span.color-chip+span.color-chip{margin-left:1px}
.board th .clue-button span.color-chip.struck,.line-clues span.color-chip.struck{opacity:.38}
.color-palette{display:flex;gap:0}
.color-palette[hidden]{display:none}
.color-swatch-dot{display:block;width:24px;height:24px;border-radius:50%;background:var(--chip);box-shadow:0 0 0 2px #fffef9,0 0 0 3px #d6dccb}
.paint-tools .color-swatch.active .color-swatch-dot{box-shadow:0 0 0 2px #fffef9,0 0 0 4px var(--green)}
html[data-theme=dark] .color-swatch-dot{box-shadow:0 0 0 2px #1d2520,0 0 0 3px #3a463f}
html[data-theme=dark] .paint-tools .color-swatch.active .color-swatch-dot{box-shadow:0 0 0 2px #1d2520,0 0 0 4px var(--green)}
.color-palette.own-row{display:grid;grid-template-columns:repeat(var(--palette-cols,6),minmax(40px,1fr));gap:2px;align-self:stretch;width:100%;box-sizing:border-box;margin:0 0 6px;padding:2px;border-radius:12px;background:#f1f4ea}
.color-palette.own-row .color-swatch{position:relative;display:flex;align-items:center;justify-content:center;height:44px;min-width:40px;padding:0;border:0;border-radius:9px;background:transparent;cursor:pointer}
.color-palette.own-row .color-swatch.active{background:#fffef9;box-shadow:0 1px 4px #394d3014}
@media(min-width:601px){
  .action-dock:has(>.color-palette.own-row){flex-wrap:wrap}
  .action-dock>.color-palette.own-row{flex:1 0 100%;order:-1}
}
/* T19 — неверная клетка цветного поля: цвет игрока под красной рамкой с белым зазором и красной косой чертой — не тёмно-красная
   заливка, которую легко спутать с «коричневым» палитры (AGENTS.md: «Один цвет — один смысл») */
.board td.cell button.filled.correction-target.pc1{--mistake-fill:var(--pc1)}.board td.cell button.filled.correction-target.pc2{--mistake-fill:var(--pc2)}.board td.cell button.filled.correction-target.pc3{--mistake-fill:var(--pc3)}.board td.cell button.filled.correction-target.pc4{--mistake-fill:var(--pc4)}.board td.cell button.filled.correction-target.pc5{--mistake-fill:var(--pc5)}.board td.cell button.filled.correction-target.pc6{--mistake-fill:var(--pc6)}.board td.cell button.filled.correction-target.pc7{--mistake-fill:var(--pc7)}.board td.cell button.filled.correction-target.pc8{--mistake-fill:var(--pc8)}.board td.cell button.filled.correction-target.pc9{--mistake-fill:var(--pc9)}.board td.cell button.filled.correction-target.pc10{--mistake-fill:var(--pc10)}.board td.cell button.filled.correction-target.pc11{--mistake-fill:var(--pc11)}.board td.cell button.filled.correction-target.pc12{--mistake-fill:var(--pc12)}
.board td.cell button.filled.correction-target.pc1,.board td.cell button.filled.correction-target.pc2,.board td.cell button.filled.correction-target.pc3,.board td.cell button.filled.correction-target.pc4,.board td.cell button.filled.correction-target.pc5,.board td.cell button.filled.correction-target.pc6,.board td.cell button.filled.correction-target.pc7,.board td.cell button.filled.correction-target.pc8,.board td.cell button.filled.correction-target.pc9,.board td.cell button.filled.correction-target.pc10,.board td.cell button.filled.correction-target.pc11,.board td.cell button.filled.correction-target.pc12{background:linear-gradient(to top right,transparent calc(50% - max(1px,calc(var(--cell)*.06))),#c62f24 calc(50% - max(1px,calc(var(--cell)*.06))) calc(50% + max(1px,calc(var(--cell)*.06))),transparent calc(50% + max(1px,calc(var(--cell)*.06)))),var(--mistake-fill);box-shadow:inset 0 0 0 max(2px,calc(var(--cell)*.1)) #c62f24,inset 0 0 0 max(3px,calc(var(--cell)*.17)) #fffef9}
/* T25 — цветной бланк (docs/roadmap/mockups/e17-color-print): числа — фишки цвета блока, номер цвета кружком в углу фишки, легенда палитры */
.print-chip{position:relative;display:inline-flex;align-items:center;justify-content:center;min-width:1.3em;height:1.3em;padding:0 .14em;box-sizing:border-box;border-radius:.3em;font-weight:700;line-height:1;letter-spacing:-.03em;-webkit-print-color-adjust:exact;print-color-adjust:exact}
.print-chip sub{position:absolute;top:-.3em;right:-.45em;display:inline-flex;align-items:center;justify-content:center;min-width:1.6em;height:1.6em;padding:0 .2em;box-sizing:border-box;border:.14em solid #1f2a24;border-radius:.8em;background:#fff;color:#1f2a24;font-size:.5em;font-weight:700;line-height:1;letter-spacing:0;-webkit-print-color-adjust:exact;print-color-adjust:exact}
.print-clue.row:has(.print-chip){gap:.16em}
.print-clue.col:has(.print-chip){gap:.14em}
.print-clue.row:has(.print-chip sub){gap:.3em}
.print-legend{display:flex;flex-wrap:wrap;justify-content:center;gap:1.6mm 5mm;font-size:3.2mm;color:#1f2a24}
.print-legend span{display:inline-flex;align-items:center;gap:1.4mm}
.print-legend b{display:inline-grid;place-items:center;width:5.2mm;height:5.2mm;border-radius:1.2mm;font-size:3mm;-webkit-print-color-adjust:exact;print-color-adjust:exact}
.print-board:has(>.print-legend){align-content:start;gap:3mm}
/* T23 — цветные наборы в каталоге (docs/roadmap/mockups/e15-color-packs, раздел 4): переключатель вида, точки цветов на обложке, правило вместо «Учиться», пустой каталог, легенда набора, палитра на плитке */
.color-dots{position:absolute;right:7px;bottom:7px;display:flex;gap:3px;padding:4px 6px;border-radius:999px;background:#fffef9;box-shadow:0 2px 6px #0001}
.color-dots i{width:7px;height:7px;border-radius:50%}
.sets-continue-cover,#today-continue-cover,.today-pack-cover{position:relative}
.sets-continue-cover .color-dots,#today-continue-cover .color-dots,.today-pack-cover .color-dots{right:-4px;bottom:-4px;gap:2px;padding:3px 4px}
.sets-continue-cover .color-dots i,#today-continue-cover .color-dots i,.today-pack-cover .color-dots i{width:5px;height:5px}
.color-empty{display:flex;flex-direction:column;align-items:flex-start;gap:8px;padding:20px 18px;border-radius:18px;border:1.5px dashed #c9d4bd;background:#fffef9b3}
.color-empty b{font-size:15px;color:#30453b}
.color-empty span{font-size:13px;line-height:1.45;color:#5f6b57}
.color-empty .button{margin-top:6px;min-height:44px;border-radius:999px;font-size:13px}
#band-grid>.color-empty{grid-column:1/-1}
.color-legend{display:flex;flex-wrap:wrap;gap:6px;margin:2px 0 0;padding:0;list-style:none}
.color-legend li{display:inline-flex;align-items:center;gap:6px;min-height:28px;padding:0 10px;border-radius:999px;background:#fffef9cc;font-size:12px;font-weight:600}
.color-legend i{width:10px;height:10px;border-radius:50%}
.color-legend li.color-legend-more{padding:0}
.color-legend-more button{min-width:40px;min-height:40px;margin:-6px 0;padding:0 10px;border:0;border-radius:999px;background:none;color:inherit;font:inherit;cursor:pointer}
.color-tile-dots{display:flex;align-items:center;gap:2px}
.color-tile-dots i{width:6px;height:6px;border-radius:50%}
.color-tile-dots b{margin-left:2px;font-size:10px;font-weight:650;color:#65715b}
/* T24 — стыки цветных чисел (docs/roadmap/mockups/e16-color-clues): точка в зазоре — между блоками пустая клетка */
.board th.col-clue .clue-button:has(>.color-chip){gap:max(5px,calc(var(--clue)*.42))}
.board th .clue-button span.color-chip.joint-dot,.line-clues span.color-chip.joint-dot{position:relative}
.color-chip.joint-dot:after{content:'';position:absolute;pointer-events:none;--dot:max(3px,calc(var(--clue)*.24));width:var(--dot);height:var(--dot);border-radius:50%;background:#7d8677}
.board th.row-clue .color-chip.joint-dot:after{top:calc(50% - var(--dot)/2);right:calc((var(--clue)*.48 + 1px + var(--dot))/-2)}
.board th.col-clue .color-chip.joint-dot:after{left:calc(50% - var(--dot)/2);bottom:calc((max(5px,calc(var(--clue)*.42)) + var(--dot))/-2)}
.line-clues span.color-chip.joint-dot:after{--dot:3px;top:calc(50% - 1.5px);right:calc(-.22em - 1.5px);background:#fffef9d9}
.color-chip.joint-fresh:after{animation:joint-arrive .3s ease-out}
@keyframes joint-arrive{from{transform:scale(.2);opacity:0}}
@media(prefers-reduced-motion:reduce){.color-chip.joint-fresh:after{animation:none}}
html[data-theme=dark] .color-chip.joint-dot:after{background:#8f9a8a}
html[data-theme=dark] .line-clues span.color-chip.joint-dot:after{background:#fffef9d9}
.settings-list>.settings-toggle>span.settings-joints-icon{display:flex;align-items:center;justify-content:center;gap:6px}
.settings-joints-icon i{position:relative;width:10px;height:10px;border-radius:3px;background:#e08a3c}
.settings-joints-icon i+i{background:#86ad2a}
.settings-joints-icon i+i:before{content:'';position:absolute;left:-4.5px;top:3.5px;width:3px;height:3px;border-radius:50%;background:currentColor}
html[data-theme=dark] .settings-joints-icon i{background:#eda05c}
html[data-theme=dark] .settings-joints-icon i+i{background:#a6cc4f}
/* T26 — меню поля и быстрые настройки (docs/roadmap/mockups/e18-play-menu): «Пауза» в шапке поля открывает меню
   с «Продолжить», плитками действий, «Помощниками» и видом; на ноутбуке помощники — в левой колонке. */
.field-menu .settings-list{gap:10px}
.menu-continue{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;min-height:50px;margin:0 0 12px;border-radius:999px;background:linear-gradient(#367457,#245640);color:#fff;font-size:15px;font-weight:700}
.menu-continue svg{width:15px;height:15px}
.menu-tiles{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.menu-tiles:not(:has(>button:not([hidden]))){display:none}
.menu-tiles>button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;min-height:74px;padding:10px 4px;border-radius:14px;background:#f3f5ec;color:#30453b;text-align:center}
.menu-tiles svg{width:22px;height:22px;fill:none;stroke:var(--green);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.menu-tiles strong{font-size:12px;font-weight:600;line-height:1.2;hyphens:manual}
.menu-group{margin:0;border-radius:16px;background:#f7f8f2;padding:0 14px}
.menu-group:not(:has(>.menu-row:not([hidden]))){display:none}
.menu-group>b{display:block;padding:12px 0 2px;font-size:10px;font-weight:800;letter-spacing:1.4px;text-transform:uppercase;color:#5a7151}
.menu-row{display:flex;align-items:center;gap:12px;width:100%;min-height:50px;padding:7px 0;border-top:1px solid #eaece3;text-align:left;cursor:pointer;color:inherit}
.menu-group>b+.menu-row{border-top:0}
.menu-row>span:first-child{flex:none;width:26px;height:26px;display:grid;place-items:center;color:#7d906e;font-size:18px}
.menu-row>span:nth-child(2){flex:1;min-width:0}
.menu-row strong{display:block;font-size:14px;font-weight:550;line-height:1.3}
.menu-row small{display:block;margin-top:2px;font-size:11.5px;line-height:1.4;color:#6f7b66}
.menu-row>span:nth-child(3):not(.lang-switch):not(.menu-value){flex:none;font-size:20px;color:#7d8a72}
.menu-row.danger strong{color:#a4412f}
.menu-value{flex:none;font-size:13px;color:#6f7b66;white-space:nowrap}
.menu-row .settings-board-icon,.menu-row .settings-mini-icon{width:18px;height:18px}
/* В «Помощниках» — одна строка без пояснений (пояснения — в «Профиль → Настройки»), кроме цены ошибки. */
#settings-helpers .menu-row small:not(#settings-instant-note){display:none}
.menu-choice{flex-wrap:wrap;row-gap:8px;cursor:default}
.menu-choice>span:nth-child(2){flex:1 1 calc(100% - 38px)}
.menu-choice .lang-switch{flex:none;margin-left:38px}
.menu-choice .lang-switch button{min-height:36px;padding:6px 10px;font-size:12.5px}
.menu-row input[type=checkbox]{flex:none;appearance:none;-webkit-appearance:none;position:relative;width:44px;height:26px;margin:0;border-radius:999px;background:#d5dbcb;cursor:pointer;transition:background .15s}
.menu-row input[type=checkbox]:before{content:'';position:absolute;left:3px;top:3px;width:20px;height:20px;border-radius:50%;background:#fff;box-shadow:0 1px 3px #0003;transition:transform .15s}
.menu-row input[type=checkbox]:checked{background:var(--green)}
.menu-row input[type=checkbox]:checked:before{transform:translateX(18px)}
.field-menu .settings-keys-list{padding:2px 0 12px 38px}
.menu-foot{display:flex;flex-direction:column;gap:10px}
.menu-foot:not(:has(>:not([hidden]))){display:none}
#settings-all{align-self:flex-end;display:inline-flex;align-items:center;gap:4px;min-height:40px;padding:0 4px;font-size:13px;font-weight:700;color:var(--green)}
.menu-admin{display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%;min-height:44px;padding:8px 14px;border:1.5px dashed #d2c3b9;border-radius:12px;color:#8a6b5e;font-size:12.5px;text-align:left}
.menu-admin strong{font-weight:700}
.field-menu .settings-engine{margin-top:10px}
/* Пока открыто меню на паузе, поле закрыто размытием без своей карточки «Пауза». */
body:has(#puzzle-settings.paused[open]) .play-overlay-card{visibility:hidden}
/* «Пауза» — в шапке поля: значок паузы, на паузе — «продолжить». */
.puzzle.playing .play-pause{flex:none;display:grid;place-items:center;width:42px;height:42px;padding:0;border-radius:13px;background:#eef2e4;color:var(--green)}
.play-pause svg{width:20px;height:20px}
.play-pause .resume-icon,.play-pause.resume .pause-icon{display:none}
.play-pause.resume .resume-icon{display:block}
.play-pause:disabled{opacity:.4}
/* «Вписать» на увеличенном поле телефона. */
.board-fit{position:absolute;right:12px;top:10px;z-index:5;display:flex;align-items:center;gap:6px;min-height:40px;padding:0 14px;border-radius:999px;background:#253d33;color:#fff;font-size:13px;font-weight:700;box-shadow:0 6px 14px #0003}
.board-fit svg{width:16px;height:16px}
/* Буквы клавиш на доке — после первого нажатия клавиши или под мышью: список — в левой колонке. */
@media(hover:hover) and (pointer:fine){body:not(.keys-used) .action-dock button:not(:hover) .dock-key{display:none}}
/* Шапка в игре: без крошки поля и без Пикро+ — над полем есть «‹ Набор» и название. */
body.playing #puzzle-label,body.playing #nav-plus{display:none}
.play-keys-toggle{display:none}
@media(max-width:760px){
  /* Телефон: шапки приложения в игре нет — её место занимает шапка поля (кроме «обновить»). */
  body.playing:not(:has(#app-update:not([hidden]))){--header-height:env(safe-area-inset-top,0px)}
  body.playing:not(:has(#app-update:not([hidden]))) .topbar{display:none}
  body.playing:not(:has(#app-update:not([hidden]))) main{margin-top:env(safe-area-inset-top,0px)}
  .field-menu .panel-heading h2{font-size:24px}
}
@media(min-width:1100px){
  .puzzle.playing .play-pause{order:2;margin-left:auto}
  .puzzle.playing .play-lives{order:1}
  .puzzle.playing .play-timer{order:0}
  .puzzle.playing .play-progress{order:3}
  .puzzle.playing .play-mini,.puzzle.playing .play-credit{order:1}
  /* Помощники в левой колонке — карточкой, переключаются на глазах. */
  .puzzle.playing .play-bar>#settings-helpers{padding:2px 16px 6px;border-radius:16px;background:#fffef9f2;border:1px solid #e1e5d7}
  .play-bar>#settings-helpers .menu-row{min-height:40px;padding:5px 0;gap:10px}
  .play-bar>#settings-helpers .menu-row>span:first-child{display:none}
  .play-bar>#settings-helpers .menu-row strong{font-size:13px;font-weight:500}
  .play-bar>#settings-helpers .menu-row small{display:none}
  .play-bar>#settings-helpers .menu-choice{flex-wrap:nowrap}
  .play-bar>#settings-helpers .menu-choice>span:nth-child(2){flex:1 1 auto}
  .play-bar>#settings-helpers .menu-choice .lang-switch{margin-left:auto}
  .play-bar>#settings-helpers .menu-choice .lang-switch button{min-height:30px;padding:4px 8px;font-size:11.5px}
  .play-bar>#settings-helpers .menu-row input[type=checkbox]{transform:scale(.86);transform-origin:right center}
  .puzzle.playing .play-keys-toggle{display:flex;justify-content:space-between;align-items:center;min-height:44px;padding:0 16px;border-radius:16px;border:1px dashed #d7ddcf;font-size:10px;font-weight:800;letter-spacing:1.4px;text-transform:uppercase;color:#5a7151}
  .puzzle.playing .play-keys-toggle span+span{font-size:12px;font-weight:650;letter-spacing:0;text-transform:none;color:var(--green)}
  .puzzle.playing .play-keys-toggle[aria-expanded=true]{border-bottom-left-radius:0;border-bottom-right-radius:0;border-bottom:0}
  .puzzle.playing .play-keys-toggle[aria-expanded=true]+.play-keys{margin-top:-14px;border-top:0;border-top-left-radius:0;border-top-right-radius:0}
}
html[data-theme=dark] .menu-tiles>button{background:#252d28;color:#dfe6dc}
html[data-theme=dark] .menu-tiles svg{stroke:#9fd0b2}
html[data-theme=dark] .menu-group{background:#1c231f}
html[data-theme=dark] .menu-group>b{color:#9fb293}
html[data-theme=dark] .menu-row{border-top-color:#2f3833}
html[data-theme=dark] .menu-row>span:first-child{color:#b0b7aa}
html[data-theme=dark] .menu-row small,html[data-theme=dark] .menu-value{color:#a6aea1}
html[data-theme=dark] .menu-row.danger strong{color:#e9ad9f}
html[data-theme=dark] .menu-row input[type=checkbox]{background:#3a443e}
html[data-theme=dark] .menu-row input[type=checkbox]:checked{background:#5e9c7c}
html[data-theme=dark] #settings-all{color:#9fd0b2}
html[data-theme=dark] .menu-admin{border-color:#5a4c45;color:#d6b5a6}
html[data-theme=dark] .puzzle.playing .play-pause{background:#27312b;color:#a9d1b5}
html[data-theme=dark] .board-fit{background:#dfe6dc;color:#1c231f}
html[data-theme=dark] .puzzle.playing .play-bar>#settings-helpers{background:#1e2521f2;border-color:#354039}
html[data-theme=dark] .puzzle.playing .play-keys-toggle{border-color:#37433b;color:#9fb293}
html[data-theme=dark] .puzzle.playing .play-keys-toggle span+span{color:#9fd0b2}
/* Карточка набора справа в тёмной теме: светлый фон набора — приглушённо, текст читается. */
html[data-theme=dark] .play-pack{background:#2c342e;background:color-mix(in srgb,var(--pack-bg,#2c342e) 16%,#1e2521)}
html[data-theme=dark] .menu-continue{background:linear-gradient(#3f8a66,#2c6b4f);color:#fff}
#dock-settings .more-icon,.puzzle.playing #dock-settings .settings-icon{display:none}
.puzzle.playing #dock-settings .more-icon{display:block}
/* «Профиль → Настройки» (docs/roadmap/mockups/e18-play-menu, п. 7): сверху — кто вы и тариф, дальше группы по смыслу;
   выбор из нескольких — справа в строке (на телефоне — под текстом), переключатели — как в меню поля;
   на ноутбуке слева — список разделов, раздел на экране отмечен. */
#settings .settings-inner{max-width:680px;display:flex;flex-direction:column;gap:14px}
#settings .settings-index{display:none}
#settings .settings-body{display:flex;flex-direction:column;gap:14px;min-width:0}
.settings-me{display:flex;align-items:center;gap:14px;padding:16px;border-radius:18px;background:#fffef9f2;border:1px solid #e1e5d7}
.settings-avatar{flex:none;width:48px;height:48px;border-radius:15px;background:var(--green);color:#fff;display:grid;place-items:center;font-size:20px;font-weight:700}
.settings-me-text{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.settings-me-text strong{font-size:16px;font-weight:650;color:#253d33;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.settings-me-text small{font-size:12.5px;color:#65715b}
.settings-me-plan{flex:none;display:flex;flex-direction:column;align-items:flex-end;gap:6px}
.settings-me-plan strong{font-size:12px;font-weight:700;padding:4px 10px;border-radius:999px;background:#eef2e4;color:var(--green)}
.settings-plus{min-height:36px;padding:0 14px;border-radius:999px;background:#2b2a24;color:#f3d27a;font-size:12.5px;font-weight:800}
#settings .settings-group{padding:2px 18px 6px;scroll-margin-top:16px}
#settings .settings-group>b{font-size:10.5px;font-weight:800;letter-spacing:1.4px;color:#5a7151;padding:14px 0 4px}
#settings .settings-row{min-height:54px;padding:8px 0}
#settings .settings-row>span:first-child{flex:1;min-width:0;color:#30453b;font-size:14.5px;font-weight:550}
#settings .settings-row-note{font-weight:400}
#settings .settings-row-stack{flex-direction:row;flex-wrap:wrap;align-items:center;gap:8px 12px}
#settings .settings-row-stack .lang-switch button{flex:none;min-width:44px}
#settings .settings-row-stack input.settings-time{flex-basis:100%}
#settings .settings-row input[type=checkbox]{flex:none;appearance:none;-webkit-appearance:none;position:relative;width:44px;height:26px;margin:0;border-radius:999px;background:#d5dbcb;cursor:pointer;transition:background .15s}
#settings .settings-row input[type=checkbox]:before{content:'';position:absolute;left:3px;top:3px;width:20px;height:20px;border-radius:50%;background:#fff;box-shadow:0 1px 3px #0003;transition:transform .15s}
#settings .settings-row input[type=checkbox]:checked{background:var(--green)}
#settings .settings-row input[type=checkbox]:checked:before{transform:translateX(18px)}
#settings .settings-action{width:100%;text-align:left;cursor:pointer;color:inherit;text-decoration:none}
#settings .settings-action>span:last-child,#settings .settings-chev{margin-left:auto;color:#7d8a72;font-size:20px;font-weight:400}
#settings .settings-action.danger>span:first-child{color:#a4412f}
#settings .settings-row-text{min-height:0;padding:10px 0 12px}
#settings .settings-row-text .settings-row-note{margin-top:4px;line-height:1.5}
#settings .settings-group>.settings-note{margin:4px 0 12px;line-height:1.55}
#settings .account-confirm{margin:2px 0 12px}
#settings .settings-board-row strong{font-weight:600}
@media(max-width:600px){
  #settings .settings-row-stack{flex-direction:column;align-items:stretch;flex-wrap:nowrap}
  #settings .settings-row-stack .lang-switch button{flex:1}
  .settings-me{padding:14px}
  .settings-me-plan strong{display:none}
  .settings-me-text strong{white-space:normal;overflow-wrap:anywhere}
}
@media(min-width:1100px){
  #settings .settings-inner{max-width:980px;display:grid;grid-template-columns:200px minmax(0,1fr);gap:18px 40px;align-items:start}
  #settings .settings-inner>.print-head{grid-column:1/-1}
  #settings .settings-index{grid-column:1;display:flex;flex-direction:column;gap:2px;position:sticky;top:20px}
  #settings .settings-index button{min-height:42px;padding:0 14px;border-radius:12px;text-align:left;font-size:14px;font-weight:550;color:#5f6b57}
  #settings .settings-index button[aria-current=true]{background:#e3eedb;color:var(--green);font-weight:700}
  #settings .settings-body{grid-column:2;max-width:680px}
}
html[data-theme=dark] .settings-me{background:#1e2521f2;border-color:#354039}
html[data-theme=dark] .settings-me-text strong{color:#e4ece1}
html[data-theme=dark] .settings-me-text small{color:#bfc7b9}
html[data-theme=dark] .settings-me-plan strong{background:#27312b;color:#a9d1b5}
html[data-theme=dark] .settings-plus{background:#2b2a24;color:#f3d27a}
html[data-theme=dark] #settings .settings-group>b{color:#9fb293}
html[data-theme=dark] #settings .settings-row>span:first-child{color:#dfe6dc}
html[data-theme=dark] #settings .settings-row input[type=checkbox]{background:#3a443e}
html[data-theme=dark] #settings .settings-row input[type=checkbox]:checked{background:#5e9c7c}
html[data-theme=dark] #settings .settings-action.danger>span:first-child{color:#ffaa9c}
html[data-theme=dark] #settings .settings-index button{color:#c2cabd}
html[data-theme=dark] #settings .settings-index button[aria-current=true]{background:#27312b;color:#a9d1b5}
/* Avatar letter in «Профиль → Настройки»: the same green as the avatar in the header — white on the light dark-theme green read 2:1. */
html[data-theme=dark] .settings-avatar{background:linear-gradient(135deg,#367457 0%,#245640 100%)}
/* Phone dock in a game (e18): marks at least 44 px wide, with captions on a black-and-white board as in the
   mockup; a lone «Подсказка» takes the whole lower row instead of half of it with a hole beside it. */
@media(max-width:600px){
  .puzzle.playing .action-dock .paint-tools button,.puzzle.playing .action-dock .dock-quiet,.puzzle.playing .action-dock .tool-button{min-width:44px}
  .puzzle.playing .dock-tools:not(:has(#color-palette:not([hidden]))) .tool-caption{display:block}
  .puzzle.playing .dock-tools:not(:has(#color-palette:not([hidden]))) :is(.paint-tools button,.dock-quiet,.tool-button){min-width:56px;height:52px;gap:4px}
  .puzzle.playing .dock-primary:not(:has(.play-check:not([hidden]))) #hint{grid-column:1/-1}
}
/* The board's scrollbar in the dark theme: the light-theme thumb read as a bright stripe under the board. */
html[data-theme=dark] .board-viewport{scrollbar-color:#3d4a42 transparent}
/* The first load of «Наборы», a row and a pack: grey rows, header and tiles instead of an empty screen. */
.sets-stars:empty{visibility:hidden}
.band-skeleton .band-head h2{width:140px;height:18px;border-radius:6px;background:#e8eae1}
.band-skeleton .band-track{overflow:hidden}
.pack-header.pack-skeleton{background:#eceee6;min-height:150px;justify-content:flex-end}
.pack-header.pack-skeleton i{display:block;height:12px;border-radius:6px;background:#e0e3d8}
.pack-header.pack-skeleton i:nth-child(1){width:80px}.pack-header.pack-skeleton i:nth-child(2){width:220px;height:30px;border-radius:8px}.pack-header.pack-skeleton i:nth-child(3){width:min(420px,80%)}
.pack-body.pack-skeleton .pack-tile{background:#eceee6}
html[data-theme=dark] .band-skeleton .band-head h2,html[data-theme=dark] .pack-header.pack-skeleton i{background:#303632}
html[data-theme=dark] .pack-header.pack-skeleton,html[data-theme=dark] .pack-body.pack-skeleton .pack-tile{background:#1f2621}
/* «Удалить навсегда»: red in both themes — the dark theme's green main button rule came later and won. */
.button.primary.danger{background:#a8463b;border-color:#a8463b;color:#fff}
html[data-theme=dark] .button.primary.danger{background:#a8463b;border-color:#ea8173;color:#fff}
/* The number editor on a phone: the board behind the sheet stays sharp — the line being typed in is above it. */
@media(max-width:600px){dialog.clue-editor::backdrop{backdrop-filter:none;background:#35463326}}
/* Phone dock of a scan or an own board: up to nine tools — they share the row up to 44 px each instead of
   34 px with a gap in the middle; on a narrow phone they still fit. */
@media(max-width:600px){
  .puzzle:not(.playing) .dock-tools>:is(.dock-quiet,.tool-button){flex:1 1 34px;max-width:44px}
  .puzzle:not(.playing) .dock-tools>.paint-tools{display:flex;flex:3 1 102px;max-width:132px}
  .puzzle:not(.playing) .dock-tools>.paint-tools>button{flex:1 1 0}
}
/* e26-shop — «Магазин» (docs/roadmap/mockups/e26-shop): what there is, what may be bought; offers in the game */
.shop-inner{max-width:560px;display:flex;flex-direction:column;gap:12px}
.shop-side,.shop-main{display:flex;flex-direction:column;gap:12px}
.shop-card{display:flex;flex-direction:column;gap:10px;padding:14px;border-radius:16px;background:#fffef9f2;border:1px solid #e1e5d7;color:#30453b}
.shop-card h2{margin:0;display:flex;align-items:center;gap:10px;font:650 15px/1.3 Inter,system-ui,sans-serif;color:#253d33}
.shop-have-note{margin-left:auto;font-size:12px;font-weight:600;color:#5f6b57}
.shop-icon{flex:none;width:32px;height:32px;border-radius:10px;display:grid;place-items:center;background:#e3eedb;color:var(--green)}
.shop-icon svg{width:18px;height:18px}
.shop-icon.ice{background:#e3eff6;color:#2f6f96}.shop-icon.fire{background:#fbefdc;color:#b06a14}.shop-icon.star{background:#fbf1d6;color:#9a6f0f}
.shop-have{gap:0;padding:4px 14px}
.shop-have-row{display:flex;align-items:center;gap:10px;padding:9px 0;border-top:1px solid #eef0e8}
.shop-have-row:first-child{border-top:0}
.shop-have-row strong{font-size:19px;font-weight:750;color:#253d33;font-variant-numeric:tabular-nums}
.shop-row-text{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px}
.shop-row-text b{font-size:14px;font-weight:650;color:#253d33}
.shop-row-text small{font-size:12px;color:#5f6b57}
.shop-plus{display:flex;flex-wrap:wrap;align-items:center;gap:10px;padding:12px 14px;border-radius:16px;background:linear-gradient(135deg,#e3eedb,#f2f5ea);border:1px solid #d6e2cc}
.shop-plus-crown{flex:none;width:32px;height:32px;border-radius:10px;background:var(--green);color:#fff;display:grid;place-items:center;font-weight:800;font-size:18px}
.shop-plus-text{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.shop-plus-text b{font-size:14px;color:#253d33}.shop-plus-text small{font-size:12px;color:#5f6b57}
.shop-plus .button{min-height:42px;padding:0 18px}
.shop-note{margin:0;font-size:12px;line-height:1.45;color:#5f6b57}
.shop-restore{align-self:flex-start;min-height:40px;padding:0;font:inherit;font-size:13px;font-weight:700;color:var(--green)}
.shop-restore[hidden]{display:none}
.shop-text{margin:0;font-size:12.5px;line-height:1.45;color:#5f6b57}
.shop-offers{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;padding-top:6px}
.shop-offers.two{grid-template-columns:repeat(2,minmax(0,1fr))}
.shop-offer{position:relative;display:flex;flex-direction:column;align-items:center;gap:1px;min-height:92px;padding:10px 6px 9px;border-radius:14px;background:#f3f5ec;border:1px solid #e1e5d7;color:inherit;font:inherit}
.shop-offer b{font-size:19px;font-weight:750;color:#253d33;font-variant-numeric:tabular-nums}
.shop-offer small{font-size:11px;color:#5f6b57}
.shop-best{position:absolute;top:-8px;left:50%;transform:translateX(-50%);font:800 9px/1.5 Inter,system-ui,sans-serif;letter-spacing:.8px;font-style:normal;color:#fff;background:var(--green);border-radius:999px;padding:1px 7px;white-space:nowrap}
.shop-price{display:inline-flex;align-items:center;justify-content:center;margin-top:6px;min-width:62px;min-height:30px;padding:0 10px;border-radius:999px;background:#fffef9;border:1px solid #e1e5d7;font-size:12.5px;font-weight:750;color:var(--green);font-variant-numeric:tabular-nums}
.shop-buy{margin:0;flex:none;min-height:40px;min-width:76px;padding:0 14px;background:#eef2e4;font:inherit;font-weight:750;font-size:13px}
.shop-offer:disabled,.shop-buy:disabled,.shop-theme:disabled{opacity:.6}
.shop-offer:focus-visible,.shop-buy:focus-visible,.shop-theme:focus-visible{outline:2px solid var(--green);outline-offset:2px}
.shop-rows{display:flex;flex-direction:column}
.shop-row{display:flex;align-items:center;gap:10px;padding:9px 0;border-top:1px solid #eef0e8}
.shop-card>h2+.shop-row,.shop-rows>.shop-row:first-child{border-top:0}
.shop-owned{flex:none;font-size:12px;font-weight:700;color:#5f7a4f}
.shop-themes{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.shop-theme{display:flex;flex-direction:column;align-items:center;gap:3px;padding:7px 5px 8px;min-height:44px;border-radius:12px;background:#f3f5ec;border:1px solid #e1e5d7;color:inherit;font:inherit}
.shop-theme.on{box-shadow:0 0 0 2px var(--green);border-color:transparent}
.shop-theme b{font-size:12px;font-weight:650;color:#253d33}
.shop-theme small{font-size:11px;font-weight:700}
.shop-price-text{color:var(--green)}
.shop-card>.button{align-self:flex-start;min-height:42px;padding:0 18px;display:inline-flex;align-items:center}
.hint-actions .hint-buy{grid-column:1/-1}
.today-revive-buy{margin-top:2px}
.plus-pack{display:flex;align-items:center;gap:10px;width:100%;min-height:52px;padding:10px 0;border-top:1px solid #eef0e8;text-align:left;font:inherit;color:inherit}
.plus-pack>span:first-child{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.plus-pack b{font-size:14px;color:#253d33}.plus-pack small{font-size:12px;color:#5f6b57}
.plus-pack .shop-price{margin:0;min-height:40px;min-width:76px}
.board-theme.store{cursor:pointer}
.board-theme.trying{box-shadow:0 0 0 2px #d08a2e;border-color:transparent}
.board-theme.trying .board-theme-swatch{filter:none;opacity:1}
.board-themes-buy{display:flex;flex-direction:column;gap:8px}
.board-themes-buy p{margin:0;font-size:13px;line-height:1.4;color:#5f6b57}
.board-themes-buy[hidden]{display:none}
@media(min-width:1100px){
  .shop-inner{max-width:1100px;display:grid;grid-template-columns:300px minmax(0,1fr);gap:16px 24px;align-items:start}
  .shop-head{grid-column:1/-1}
  .shop-main{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;align-items:start}
  .shop-plus{flex-direction:column;align-items:stretch}
  .shop-plus .button{width:100%}
}
html[data-theme=dark] .shop-card{background:#1e2521f2;border-color:#354039;color:#d8e8e0}
html[data-theme=dark] .shop-card h2,html[data-theme=dark] .shop-row-text b,html[data-theme=dark] .shop-have-row strong,html[data-theme=dark] .shop-offer b,
html[data-theme=dark] .shop-theme b,html[data-theme=dark] .shop-plus-text b,html[data-theme=dark] .plus-pack b{color:#d8e8e0}
html[data-theme=dark] .shop-row-text small,html[data-theme=dark] .shop-have-note,html[data-theme=dark] .shop-offer small,html[data-theme=dark] .shop-text,
html[data-theme=dark] .shop-note,html[data-theme=dark] .shop-plus-text small,html[data-theme=dark] .plus-pack small,html[data-theme=dark] .board-themes-buy p{color:#bfc7b9}
html[data-theme=dark] .shop-have-row,html[data-theme=dark] .shop-row,html[data-theme=dark] .plus-pack{border-color:#2f3a33}
html[data-theme=dark] .shop-icon{background:#30372b}
html[data-theme=dark] .shop-icon.ice{background:#1d2d38;color:#8cc0e3}html[data-theme=dark] .shop-icon.fire{background:#3a2c18;color:#e9a650}html[data-theme=dark] .shop-icon.star{background:#3a3218;color:#e9c35e}
html[data-theme=dark] .shop-offer,html[data-theme=dark] .shop-theme{background:#212a25;border-color:#354039}
html[data-theme=dark] .shop-price{background:#1e2521;border-color:#354039}
html[data-theme=dark] .shop-buy{background:#27312b}
html[data-theme=dark] .shop-owned{color:#a9c99a}
html[data-theme=dark] .shop-plus{background:linear-gradient(135deg,#223129,#1e2521);border-color:#354039}
html[data-theme=dark] .shop-plus-crown{background:#3f7a5c}
html[data-theme=dark] .shop-best{background:#3f7a5c}

/* e34 — puzzles of Пикро+ opened by a video on the pack screen; ads after a solved puzzle */
.pack-tile-video{display:inline-flex;align-items:center;min-height:32px;padding:0 12px;border-radius:999px;background:#2b2a24;color:#f3d27a;font-size:12px;font-weight:700}
.pack-tile.plus.video{border:2px dashed #b9c4ad}
.pack-tile.by-video{position:relative}
.pack-tile.by-video:after{content:'▶';position:absolute;top:7px;left:9px;font-size:9px;color:#7f9670}
.pack-tile.fresh{box-shadow:0 0 0 4px #e3eedb,0 0 0 6px #b9d6a6;animation:pack-fresh 1.2s ease-out}
@keyframes pack-fresh{from{transform:scale(.92)}60%{transform:scale(1.04)}to{transform:none}}
@media(prefers-reduced-motion:reduce){.pack-tile.fresh{animation:none}}
.pack-videos{margin-top:14px;display:flex;flex-direction:column;gap:8px;padding:12px 14px;border-radius:16px;background:#fffef9;border:1px solid #e1e5d7;font-size:13px}
.pack-videos-head{display:flex;align-items:center;gap:10px}
.pack-videos-head strong{font-size:14px;color:#253d33}
.pack-videos-head em{margin-left:auto;font-style:normal;font-size:12px;font-weight:650;color:#5f6b57}
.pack-videos-icon{flex:none;width:30px;height:30px;border-radius:10px;display:grid;place-items:center;background:#fbf1d6;color:#b07f12;font-size:13px}
.pack-videos-meter{display:flex;gap:4px}.pack-videos-meter i{flex:1;height:6px;border-radius:3px;background:#dfe4d6}.pack-videos-meter i.on{background:var(--green)}
.pack-videos small{color:#5f6b57;font-size:12px;line-height:1.45}
.pack-videos-plus{margin-top:10px;width:100%;display:flex;align-items:center;gap:12px;padding:11px 12px;border-radius:16px;border:1px solid #d6e2cc;background:linear-gradient(135deg,#e3eedb,#f2f5ea);font:inherit;text-align:left;color:#30453b;min-height:56px}
.pack-videos-plus .plus-crown{width:34px;height:34px;border-radius:11px;font-size:18px}
.pack-videos-plus b{display:block;font-size:13.5px;color:#253d33}.pack-videos-plus small{display:block;font-size:12px;color:#5f6b57}
.guest-video{margin:0;font-size:13px;line-height:1.45;color:#5f6b57}
html[data-theme=dark] .pack-tile-video{background:#262b28;color:#f3d27a}
html[data-theme=dark] .pack-tile.plus.video{border-color:#4a554d}
html[data-theme=dark] .pack-tile.fresh{box-shadow:0 0 0 4px #223129,0 0 0 6px #4f7a5f}
html[data-theme=dark] .pack-videos{background:#1e2521;border-color:#354039}
html[data-theme=dark] .pack-videos-head strong,html[data-theme=dark] .pack-videos-plus b{color:#d8e8e0}
html[data-theme=dark] .pack-videos-head em,html[data-theme=dark] .pack-videos small,html[data-theme=dark] .pack-videos-plus small,html[data-theme=dark] .guest-video{color:#c2cabd}
html[data-theme=dark] .pack-videos-icon{background:#3a3218;color:#e9c35e}
html[data-theme=dark] .pack-videos-meter i{background:#2f3a33}
html[data-theme=dark] .pack-videos-plus{background:linear-gradient(135deg,#223129,#1d2520);border-color:#354039;color:#d3e3da}
/* The ad under «Дальше»: dashed, grey, labelled — never like a card of Пикро; on a laptop in a column on the right. */
.done-ad{position:relative;max-width:420px;margin:28px auto 0;display:flex;flex-direction:column;gap:8px}
.done-ad[hidden]{display:none}
.done-ad-label{position:absolute;top:-8px;left:12px;z-index:1;padding:0 5px;border-radius:4px;background:#f6f5ef;font-size:9px;font-weight:800;letter-spacing:1px;color:#8d977f}
.done-ad-slot{min-height:100px;border:1px dashed #c9cfbd;border-radius:12px;background:#f1f2ec;display:grid;place-items:center;overflow:hidden}
.done-ad-demo{font-size:12px;color:#7b8572}
.done-ad-foot{display:flex;justify-content:space-between;gap:10px;font-size:12px;color:#5f6b57}
.done-ad-foot a{flex:none;font-weight:700;color:var(--green);min-height:40px;display:inline-flex;align-items:center;margin-top:-10px}
@media(min-width:1100px){
  .view.done:not([hidden]):has(.done-ad:not([hidden])){display:flex;justify-content:center;align-items:flex-start;gap:40px}
  .view.done:has(.done-ad:not([hidden])) .done-inner{margin:0;flex:0 1 420px}
  .done-ad{flex:0 0 300px;margin:120px 0 0}
  .done-ad-slot{min-height:250px}
}
html[data-theme=dark] .done-ad-label{background:#151b17;color:#8d9a88}
html[data-theme=dark] .done-ad-slot{background:#1a211c;border-color:#3a463e}
html[data-theme=dark] .done-ad-demo,html[data-theme=dark] .done-ad-foot{color:#a3b09d}

/* e35 — a reward for a video: the black and gold button of e34, wherever a video gives something */
.button.video-button{background:#2b2a24;color:#f3d27a;border:0;font-weight:700}
html[data-theme=dark] .button.video-button{background:#0f1411;color:#f3d27a}
.done-double{width:100%;box-sizing:border-box;display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:16px;background:#fbf1d6;border:1px solid #efdca6;text-align:left}
.done-double[hidden]{display:none}
.done-double b{display:block;font-size:14px;color:#5a4410}.done-double small{display:block;font-size:12px;color:#7a6630;line-height:1.35}
.done-double .video-button{flex:none;margin-left:auto;min-height:44px;padding:0 14px}
html[data-theme=dark] .done-double{background:#3a3218;border-color:#4a3f26}
html[data-theme=dark] .done-double b{color:#efe2c4}html[data-theme=dark] .done-double small{color:#d9c9a5}
.streak-freeze-video{width:100%;min-height:40px;margin-top:8px;padding:0 10px;font-size:13px}
.friends-invite-plus{display:block;margin-top:4px;color:#7a6630}
html[data-theme=dark] .friends-invite-plus{color:#d9c9a5}
/* e35 — a gift code received: typed in the card «Подарить Пикро+» */
.shop-gift-form{display:flex;gap:8px;align-items:flex-end;padding-top:10px;border-top:1px solid #ebeee3;margin-top:6px}
.shop-gift-form label{flex:1;display:flex;flex-direction:column;gap:4px;font-size:12.5px;color:#5f6b57}
.shop-gift-form input{min-height:44px;padding:0 12px;border-radius:12px;border:1px solid #d6dccb;font:inherit;font-size:15px;letter-spacing:.5px;text-transform:uppercase;background:#fffef9;color:#30453b}
.shop-gift-form .button{min-height:44px}
html[data-theme=dark] .shop-gift-form{border-top-color:#2f3a33}
html[data-theme=dark] .shop-gift-form input{background:#1e2521;border-color:#354039;color:#d8e8e0}
.event-full .plus-crown{width:34px;height:34px;border-radius:11px;font-size:18px}
.event-full .button{min-height:44px}
/* e35 — the booklet: the answers of the printed puzzles on the last sheet */
.print-answers-title{margin:4mm 0 0;font-family:Georgia,"Times New Roman",serif;font-weight:400;font-size:18pt}
.print-answers-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:5mm;margin-top:6mm}
.print-answer{margin:0;display:flex;flex-direction:column;align-items:center;gap:2mm;break-inside:avoid}
.print-answer-picture{width:100%;max-height:40mm;border:.3mm solid #c9cfbd}
.print-answer figcaption{font-size:8.5pt;color:#4a5745;text-align:center}
.print-book{min-height:44px;margin-top:6px}
/* e37 — «Наборы» по видам (docs/roadmap/mockups/e37-catalog-final): афиши видов, вид со ступенями и полками тем,
   «Все» полки, шторка фильтра, найденное и карта прогресса. Ч/б — тушь на бумаге, цвет — тёплая бумага и мозаика. */
:root{--cat-ink:#1d2420;--cat-paper:#fffffb;--cat-line:#e6e8de;--cat-warm:#c2532f;--cat-mosaic:linear-gradient(90deg,#d9534f 0 12.5%,#e8843a 0 25%,#e9b52e 0 37.5%,#4f9a4a 0 50%,#2fa7b8 0 62.5%,#3d7cc9 0 75%,#7a55b0 0 87.5%,#c86aa0 0)}
.ink-paper{background-color:var(--cat-paper);background-image:linear-gradient(var(--cat-line) 1px,transparent 1px),linear-gradient(90deg,var(--cat-line) 1px,transparent 1px);background-size:12.5% 12.5%;color:var(--cat-ink);box-shadow:inset 0 0 0 1px #d5dbc8}
.ladder-svg{width:35px;height:12px;flex:none;color:var(--cat-ink)}.ladder-svg rect{fill:#e4e9da}.ladder-svg rect.on{fill:currentColor}
.theme-dot{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:7px;vertical-align:middle;flex:none}
.kind-mark{display:inline-block;width:14px;height:14px;border-radius:3px;flex:none;vertical-align:middle}
.kind-mark.mono{background:repeating-conic-gradient(var(--cat-ink) 0 25%,var(--cat-paper) 0 50%) 0 0/7px 7px;box-shadow:0 0 0 1px var(--cat-ink)}
.kind-mark.color{background:linear-gradient(135deg,#d9534f,#e9b52e 35%,#4f9a4a 55%,#3d7cc9 75%,#7a55b0)}
.round-button{width:44px;height:44px;flex:none;border-radius:50%;display:grid;place-items:center;background:#fffef9;border:1px solid #e1e5d7;color:var(--kind-ink,var(--green));padding:0}
.round-button svg{width:19px;height:19px}
.sets-posters{display:flex;flex-direction:column;gap:12px}
.sets-poster{display:flex;align-items:center;gap:14px;padding:14px;border-radius:22px;min-height:150px;text-decoration:none;color:var(--cat-ink)}
.sets-poster.mono{background:var(--cat-paper);border:2px solid var(--cat-ink)}
.sets-poster.color{background:linear-gradient(135deg,#fde3cf,#fdf3c9 35%,#dff0e4 65%,#e3e8fa);border:2px solid transparent}
.sets-poster.skeleton{background:#eceee6;border:0}
.sets-poster-art{flex:none;width:104px;height:104px;border-radius:16px;display:grid;place-items:center;background:#fffef9cc;position:relative}
.sets-poster-art .pixel-grid{width:80%}
.sets-poster-text{flex:1;min-width:0;display:flex;flex-direction:column;gap:5px}
.sets-poster-text strong{font-family:Georgia,"Times New Roman",serif;font-weight:400;font-size:25px;line-height:1.05}
.sets-poster.color strong{background:linear-gradient(90deg,#c2532f,#d9902a 25%,#4f9a4a 50%,#2f8fa8 65%,#3d6cc9 80%,#c86aa0);-webkit-background-clip:text;background-clip:text;color:transparent}
.sets-poster-text small{font-size:12px;line-height:1.4;color:#5f6b57}
.sets-poster-step{display:flex;align-items:center;gap:7px;font-size:12px;font-weight:650}
.sets-poster.color .ladder-svg{color:var(--cat-warm)}
.sets-poster .pack-card-bar{margin-top:2px}.sets-poster.mono .pack-card-bar i{background:var(--cat-ink)}.sets-poster.color .pack-card-bar i{background:var(--cat-mosaic)}
.sets-poster-go{align-self:flex-start;margin-top:6px;padding:10px 18px;border-radius:999px;font-size:13px;font-weight:650;color:#fff;background:var(--cat-ink)}
.sets-poster.color .sets-poster-go{background:linear-gradient(90deg,#d9534f,#e8843a)}
.sets-continue[data-kind=mono] .button.primary{background:var(--cat-ink)}
.sets-links{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.sets-link{display:flex;align-items:center;justify-content:center;gap:8px;min-height:46px;padding:0 10px;border-radius:14px;background:#fffef9;border:1px solid #e1e5d7;color:var(--green);font:inherit;font-size:13px;font-weight:650;text-decoration:none}
.sets-link svg{width:17px;height:17px;flex:none}
@media(min-width:1100px){.sets-posters{display:grid;grid-template-columns:1fr 1fr}.sets-poster{min-height:180px}.sets-poster-art{width:132px;height:132px}
  /* «Продолжить» над чёрно-белой афишей, «Все наборы» и «Карта прогресса» — над цветной: строка не растягивается на весь экран. */
  .sets .view-inner{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-areas:"head head" "notes notes" "top links" "posters posters" "new new";column-gap:16px;align-items:stretch}
  .sets-head{grid-area:head}.sets-notes{grid-area:notes}.sets-top{grid-area:top}.sets-posters{grid-area:posters}.sets-links{grid-area:links;grid-template-columns:1fr 1fr}#sets-new{grid-area:new}
  .sets .view-inner:has(#sets-continue[hidden]) .sets-top{display:none}.sets .view-inner:has(#sets-continue[hidden]) .sets-links{grid-column:1/-1}
  .sets-links .sets-link{min-height:100%}}
.kind-view[data-kind=mono]{--kind-ink:var(--cat-ink);--kind-soft:var(--cat-paper)}
.kind-view[data-kind=color]{--kind-ink:var(--cat-warm);--kind-soft:#fff1e6}
.kind-head{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}
.kind-head-text{min-width:0}.kind-head small{display:block;margin-top:6px;font-size:12.5px;line-height:1.4;color:#5f6b57}
.kind-view[data-kind=color] .kind-inner{border-top:6px solid transparent;border-image:var(--cat-mosaic) 1;padding-top:12px}
.kind-view[data-kind=color] #kind-title{background:linear-gradient(90deg,#c2532f,#d9902a 25%,#4f9a4a 50%,#3d6cc9 75%,#c86aa0);-webkit-background-clip:text;background-clip:text;color:transparent}
.kind-other{flex:none;display:inline-flex;align-items:center;gap:7px;min-height:44px;padding:0 14px 0 12px;border-radius:999px;background:#fffef9;border:1px solid #e1e5d7;font-size:13px;font-weight:650;color:var(--cat-ink);text-decoration:none;white-space:nowrap}
.kind-side{display:contents}
.kind-tabs,.kind-side-label,.kind-next,.kind-maplink{display:none}
.kind-steps{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;margin:0 -16px;padding:2px 16px 4px}
.kind-steps::-webkit-scrollbar{display:none}
.kind-step{flex:none;width:72px;min-height:44px;padding:8px 4px 7px;border-radius:14px;background:#fffef9;border:1px solid #e1e5d7;display:flex;flex-direction:column;align-items:center;gap:3px;text-align:center;font:inherit;color:#5f6b57;text-decoration:none}
.kind-step b{font-size:10.5px;font-weight:650;line-height:1.15}.kind-step small{font-size:10px;color:#65715b}
.kind-step[aria-current]{border:2px solid var(--kind-ink);background:var(--kind-soft);color:var(--kind-ink)}
.kind-step.locked{background:#eceee6;color:#7d8a72}
.kind-step-ring{width:30px;height:30px;display:grid;place-items:center}.kind-step-ring svg{width:30px;height:30px}.kind-step.locked .kind-step-ring svg{width:17px;height:17px}
.ring circle{fill:none;stroke:#e4e9da;stroke-width:3}.ring .ring-on{stroke:var(--kind-ink);stroke-linecap:round}
.kind-step-ladder{display:none}
.kind-main{display:flex;flex-direction:column;gap:16px;min-width:0}
.kind-band-head{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;column-gap:10px;row-gap:2px}.kind-band-head .round-button{grid-column:2;grid-row:1/3}
.kind-band-head h2{margin:0;font-family:Georgia,"Times New Roman",serif;font-weight:400;font-size:22px;color:#253d33}
.kind-band-head small{grid-column:1;font-size:12px;color:#65715b}
.kind-shelves{display:flex;flex-direction:column;gap:20px}
.shelf-row .band-head h2{display:flex;align-items:center}
@media(min-width:1100px){
  .kind-inner{display:grid;grid-template-columns:250px minmax(0,1fr);grid-template-areas:"side head" "side main";gap:14px 30px;max-width:1240px;align-items:start}
  .kind-head{grid-area:head}.kind-main{grid-area:main}.kind-other{display:none}
  .kind-side{grid-area:side;display:flex;flex-direction:column;gap:4px;position:sticky;top:12px}
  .kind-tabs{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-bottom:12px}.kind-tabs[hidden]{display:none}
  .kind-tab{display:flex;flex-direction:column;align-items:center;gap:7px;padding:12px 6px;border-radius:14px;background:#fffef9;border:1px solid #e1e5d7;font-size:12px;font-weight:700;color:#5f6b57;text-decoration:none}
  .kind-tab .kind-mark{width:26px;height:26px;border-radius:6px}.kind-tab.mono .kind-mark{background-size:13px 13px}
  .kind-tab[aria-current]{border:2px solid var(--kind-ink);color:var(--kind-ink)}
  .kind-side-label{display:block;padding:0 10px 4px;font-size:10px;letter-spacing:1.5px;font-weight:700;color:#5a7151}
  .kind-steps{flex-direction:column;overflow:visible;margin:0;padding:0;gap:2px}
  .kind-step{width:auto;flex-direction:row;justify-content:flex-start;gap:10px;padding:9px 10px;border:2px solid transparent;background:none;text-align:left;font-size:13px}
  .kind-step b{font-size:13px}.kind-step small{margin-left:auto;font-size:11.5px;font-variant-numeric:tabular-nums}
  .kind-step.locked{background:none;opacity:.7}
  .kind-step-ring{display:none}.kind-step-ladder{display:flex}.kind-step-ladder .ladder-svg{color:var(--kind-ink)}
  .kind-next{display:block;margin:14px 0 0;padding:10px 12px;border-radius:12px;background:#eceee6;font-size:12px;line-height:1.45;color:#5f6b57}
  .kind-next[hidden]{display:none}.kind-next b{color:#30453b}
  .kind-maplink{display:flex;align-items:center;gap:9px;margin-top:8px;padding:10px;border-radius:12px;font-size:13px;font-weight:650;color:var(--green);text-decoration:none}
  .kind-maplink svg{width:16px;height:16px}
}
.shelf-top{display:flex;align-items:center;justify-content:space-between;gap:10px}
.shelf-back{display:inline-flex;align-items:center;gap:4px;min-height:44px;font-size:14px;font-weight:650;color:var(--kind-ink,var(--green));text-decoration:none}
.shelf-back svg{width:20px;height:20px}
.shelf-view[data-kind=mono]{--kind-ink:var(--cat-ink)}.shelf-view[data-kind=color]{--kind-ink:var(--cat-warm)}
.shelf-head{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.shelf-head .view-title{margin:0}
.shelf-head .ladder-svg{width:42px;height:14px;color:var(--kind-ink,var(--cat-ink))}.shelf-head small{font-size:13px;color:#65715b}
.shelf-note{margin:0;font-size:12px;color:#65715b}
.found-view .band-view-head,.map-view .band-view-head{align-items:center}
#found-edit{margin-left:auto}.found-more{align-self:center;margin-top:4px}
.map-kind{align-self:flex-start}.map-kind button{display:inline-flex;align-items:center;gap:6px}
.map-body{display:flex;flex-direction:column;gap:14px}
.map-table{overflow-x:auto;margin:0 -16px;padding:0 16px 4px}
.map-grid{border-collapse:separate;border-spacing:3px;font-size:11px;color:#65715b}
.map-grid th{font-weight:650;font-size:10.5px;text-align:center;padding:2px 0;border-radius:8px}
.map-grid th[scope=row],.map-grid tr:first-child th:first-child{position:sticky;left:0;z-index:1;background:#f6f5ef;box-shadow:-16px 0 0 #f6f5ef;border-radius:0;text-align:left;font-size:12px;color:#30453b;white-space:nowrap;padding-right:8px}
.map-grid .map-name{display:none}
.map-grid .mine{background:#e3eedb99;border-radius:9px}
.map-grid td{text-align:center;padding:0}
.map-cell{width:40px;height:40px;border-radius:9px;border:1px solid #c9cfbd;padding:0;font:inherit;font-size:12.5px;font-weight:700;font-variant-numeric:tabular-nums;color:var(--cat-ink);background:linear-gradient(0deg,#a9b3a0 var(--part),var(--cat-paper) var(--part))}
.map-cell.closed{opacity:.55;background:linear-gradient(0deg,#d3d8c9 var(--part),#f1f2ea var(--part))}
.map-cell.full{background:var(--cat-ink);border-color:var(--cat-ink);color:#fff}
.map-cell[aria-pressed]{outline:2px solid var(--cat-ink);outline-offset:1px}
.map-none{display:inline-block;width:40px;color:#b3b9aa}
.map-pick{display:flex;flex-direction:column;gap:6px;padding:14px;border-radius:16px;background:#fffef9;border:1px solid #e1e5d7;box-shadow:0 8px 24px #3b4f3014}
.map-pick b{font-size:14px;color:#30453b}.map-pick small{font-size:12.5px;color:#5f6b57}.map-pick p{margin:4px 0 0;font-size:12.5px;line-height:1.45;color:#5f6b57}
.map-pick .button{margin-top:6px}
.map-legend{display:flex;flex-wrap:wrap;gap:8px 14px;font-size:11.5px;color:#5f6b57}
.map-legend span{display:inline-flex;align-items:center;gap:6px}
.map-key{width:13px;height:13px;border-radius:4px;border:1px solid #c9cfbd;background:var(--cat-paper)}.map-key.part{background:#a9b3a0}.map-key.full{background:var(--cat-ink);border-color:var(--cat-ink)}
@media(min-width:1100px){.map-body{flex-direction:row;align-items:flex-start;gap:24px}.map-table{margin:0;padding:0}.map-pick{width:250px;flex:none;position:sticky;top:12px}
  .map-grid .map-num{display:none}.map-grid .map-name{display:inline}.map-cell{width:54px;height:46px}.map-none{width:54px}}
.sets-filter{gap:12px}
.filter-top{display:flex;align-items:center;justify-content:space-between}
.filter-top h2{margin:0;font-size:19px;color:#253d33}
.filter-group{display:flex;flex-direction:column;gap:7px}.filter-group[hidden]{display:none}
.filter-group h3{margin:0;font-size:12.5px;font-weight:700;color:#30453b}
.filter-bands{display:flex;align-items:flex-end;gap:4px}
.filter-band{flex:1;height:44px;padding:0;border:0;background:none;display:flex;align-items:flex-end}
.filter-band:before{content:'';display:block;width:100%;height:var(--h);border-radius:4px 4px 0 0;background:#e4e9da}
.filter-band[aria-pressed=true]:before{background:var(--green)}
.filter-ends{display:flex;justify-content:space-between;font-size:11.5px;color:#5f6b57}
.filter-chips{display:flex;flex-wrap:wrap;gap:6px}
.filter-chip{display:inline-flex;align-items:center;min-height:40px;padding:0 13px;border-radius:999px;border:1px solid #e1e5d7;background:#fffef9;font:inherit;font-size:12.5px;font-weight:600;color:#5f6b57}
.filter-chip small{font-weight:500;opacity:.75}
.filter-chip[aria-pressed=true]{background:#e3eedb;border-color:#c9d9bd;color:var(--green)}
#sets-filter-go{width:100%;margin-top:6px}
html[data-theme=dark]{--cat-ink:#e6eee9;--cat-paper:#1b221e;--cat-line:#2a332d}
html[data-theme=dark] .ink-paper{box-shadow:inset 0 0 0 1px #354039}
html[data-theme=dark] .ladder-svg rect,html[data-theme=dark] .ring circle{fill:#354039}html[data-theme=dark] .ring circle{fill:none;stroke:#354039}html[data-theme=dark] .ring .ring-on{stroke:var(--kind-ink)}
html[data-theme=dark] .ladder-svg rect.on{fill:currentColor}
html[data-theme=dark] .sets-poster.mono{background:#171e1a}
html[data-theme=dark] .sets-poster.color{background:linear-gradient(135deg,#3a2a20,#353220 35%,#22322a 65%,#252b3d)}
html[data-theme=dark] .sets-poster-text small,html[data-theme=dark] .kind-head small{color:#c2cabd}
html[data-theme=dark] .sets-poster-go{color:#171e1a}html[data-theme=dark] .sets-poster.color .sets-poster-go{color:#fff}
html[data-theme=dark] .sets-poster-art{background:#1e2521cc}
html[data-theme=dark] .sets-link,html[data-theme=dark] .kind-other,html[data-theme=dark] .round-button,html[data-theme=dark] .kind-step,html[data-theme=dark] .kind-tab,html[data-theme=dark] .filter-chip,html[data-theme=dark] .map-pick{background:#1e2521;border-color:#354039;color:#c2cabd}
html[data-theme=dark] .kind-view[data-kind=color]{--kind-ink:#f0905f;--kind-soft:#2c2219}
html[data-theme=dark] .kind-view[data-kind=mono]{--kind-soft:#171e1a}
html[data-theme=dark] .kind-step.locked,html[data-theme=dark] .kind-next{background:#252c27;color:#a9b3a4}
html[data-theme=dark] .kind-band-head h2,html[data-theme=dark] .filter-top h2,html[data-theme=dark] .filter-group h3,html[data-theme=dark] .map-pick b{color:#d8e8e0}
html[data-theme=dark] .filter-chip[aria-pressed=true]{background:#30372b;border-color:#4a5a3f;color:#b6d3a2}
html[data-theme=dark] .filter-band:before{background:#354039}html[data-theme=dark] .filter-band[aria-pressed=true]:before{background:#8fb37a}
html[data-theme=dark] .map-grid th[scope=row],html[data-theme=dark] .map-grid tr:first-child th:first-child{background:#181f1a;box-shadow:-16px 0 0 #181f1a;color:#d3e3da}
html[data-theme=dark] .map-cell{border-color:#3c4237;background:linear-gradient(0deg,#4f5a4c var(--part),var(--cat-paper) var(--part))}
html[data-theme=dark] .map-cell.closed{background:linear-gradient(0deg,#353c33 var(--part),#202622 var(--part))}
html[data-theme=dark] .map-cell.full{color:#171e1a}
html[data-theme=dark] .map-grid .mine{background:#30372b99}
@media(min-width:1100px){html[data-theme=dark] .kind-step{background:none;border-color:transparent}html[data-theme=dark] .kind-step[aria-current]{background:var(--kind-soft);border-color:var(--kind-ink);color:var(--kind-ink)}html[data-theme=dark] .kind-step.locked{background:none}}
/* e37 аудит: «Все» полки — три колонки и на телефоне; «Сбросить» — касание 44 px; «Продолжить» на ноутбуке во всю ширину. */
@media(max-width:600px){.shelf-view .band-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:14px 10px}}
#sets-filter-reset{min-height:44px;padding:0 10px}
@media(min-width:1100px){.sets-top .sets-continue{flex:1 1 auto}}
@media(min-width:1100px){.map-grid th[scope=col]{vertical-align:bottom;width:56px}.map-grid .map-name{display:block;max-width:56px;line-height:1.15;white-space:normal;overflow-wrap:anywhere}}
/* e37: уроки цветных полей — палитра над полем, цветные числа; «×» скрывает уроки, ссылка в конце вида возвращает. */
.lesson-palette{display:flex;flex-wrap:wrap;justify-content:center;gap:6px;margin-bottom:12px}
.lesson-swatch{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 14px 0 9px;border-radius:999px;border:1px solid #e1e5d7;background:#fffef9;font:inherit;font-size:13px;font-weight:600;color:#5f6b57}
.lesson-swatch:before{content:'';width:22px;height:22px;border-radius:6px;background:var(--swatch)}
.lesson-swatch[aria-pressed=true]{border:2px solid #30453b;color:#30453b;padding-left:8px}
.lesson-clue-colour{display:inline-grid;place-items:center;min-width:19px;height:19px;padding:0 4px;margin:1px;border-radius:5px;color:#fff;font-size:12px;font-weight:700;line-height:1}
.lesson-col .lesson-clue-colour{display:grid;width:max-content;margin:2px auto}
.learn-band .band-head{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;column-gap:8px;row-gap:1px}.learn-band .band-head small{grid-column:1}.learn-band .learn-hide{grid-column:2;grid-row:1/3}
.learn-hide{margin-left:auto;width:40px;height:40px;flex:none;border-radius:50%;display:grid;place-items:center;font-size:22px;line-height:1;color:#7d8a72;background:none}
.learn-hide:hover{background:#eceee6}
.kind-learn-link{align-self:flex-start;display:inline-flex;align-items:center;min-height:44px;font-size:13px;font-weight:650;color:var(--green);text-decoration:none}
html[data-theme=dark] .lesson-swatch{background:#1e2521;border-color:#354039;color:#c2cabd}
html[data-theme=dark] .lesson-swatch[aria-pressed=true]{border-color:#d8e8e0;color:#d8e8e0}
html[data-theme=dark] .lesson-clue-colour{color:#171e1a}
html[data-theme=dark] .learn-hide{color:#a9b3a4}html[data-theme=dark] .learn-hide:hover{background:#252c27}
/* e38 — обучение (docs/roadmap/mockups/e38-learning): «Учиться» секциями, демо, тур, «Что нового», подсказки на месте. */
.learn-hub{display:flex;flex-direction:column;gap:16px}
.learn-grid{display:flex;flex-direction:column;gap:16px}
.learn-section{display:flex;flex-direction:column;gap:7px;scroll-margin-top:12px}
.learn-section-head{margin:0;display:flex;justify-content:space-between;align-items:baseline;padding:0 4px;font-size:10.5px;letter-spacing:1.5px;font-weight:700;text-transform:uppercase;color:#5a7151}
.learn-section-head small{font-size:11px;letter-spacing:0;font-variant-numeric:tabular-nums}
.learn-mark.warm{color:#c2532f}.learn-row.next .learn-mark.warm{background:#fde8d8;box-shadow:inset 0 0 0 2px #e8843a;color:#a8432a}
.learn-end{flex:none;font-style:normal;font-size:11.5px;font-weight:700;color:#65715b;white-space:nowrap}
.learn-tour{display:flex;align-items:center;gap:12px;width:100%;min-height:64px;padding:12px 14px;border-radius:16px;background:linear-gradient(135deg,#e3eedb,#fdf3df);border:1px solid #d9e3cd;text-align:left;font:inherit;color:#30453b}
.learn-tour-art{flex:none;width:40px;height:40px;border-radius:12px;display:grid;place-items:center;background:#fffef9;color:var(--green);font-size:18px}
.learn-tour span:nth-child(2){flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}.learn-tour strong{font-size:15px}.learn-tour small{font-size:12.5px;line-height:1.4;color:#5f6b57}
.learn-tour>b{font-size:20px;color:var(--green)}
.learn-coach{border-radius:16px;background:#fffef9f2;border:1px solid #e1e5d7;padding:12px 14px}
@media(min-width:1100px){.learn .learn-inner{max-width:1040px}.learn-grid{display:grid;grid-template-columns:1fr 1fr;align-items:start;gap:18px 24px}}
.demo-art{min-height:190px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;padding:16px;border-radius:20px;background:#fffef9f2;border:1px solid #e1e5d7}
.demo-big{display:flex;flex-direction:column;align-items:center;gap:6px;text-align:center}
.demo-big b{font-family:Georgia,"Times New Roman",serif;font-weight:400;font-size:34px;color:#253d33}.demo-big span{font-size:13px;color:#5f6b57}
.demo-chips{display:flex;flex-wrap:wrap;justify-content:center;gap:7px}
.demo-chips span{display:inline-flex;align-items:center;min-height:40px;padding:0 14px;border-radius:999px;background:#fffffb;border:1px solid #d5dbc8;font-size:13px;font-weight:600;color:#30453b}
.demo-actions{display:flex;gap:10px}.demo-actions .button{flex:1;min-height:48px;border-radius:999px;font-size:14px}
.tour-sheet{gap:12px}.tour-skip{align-self:flex-end;min-height:44px;font-size:13px}
.tour-body{display:flex;flex-direction:column;gap:10px}
.tour-body h2{margin:0;font-family:Georgia,"Times New Roman",serif;font-weight:400;font-size:28px;line-height:1.1;color:#253d33}
.tour-body p{margin:0;font-size:14px;line-height:1.5;color:#5f6b57}
.tour-body ul{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:8px}
.tour-body li{display:flex;gap:10px;align-items:flex-start;font-size:13.5px;line-height:1.4;color:#30453b}
.tour-body li i{flex:none;width:24px;height:24px;border-radius:8px;display:grid;place-items:center;font-style:normal;font-size:12px;background:#e3eedb;color:var(--green)}
.tour-art{min-height:190px;border-radius:22px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;padding:14px;position:relative;overflow:hidden}
.tour-art.packs{background:#eef2e4}.tour-art.help{background:#fdf3df}.tour-art.daily{background:#fbefdc}.tour-art.own{background:#e2ebf4}
.tour-poster{display:flex;align-items:center;gap:8px;padding:14px 16px;border-radius:16px;font-family:Georgia,"Times New Roman",serif;font-size:17px;box-shadow:0 8px 20px #3b4f3022}
.tour-poster .kind-mark{width:26px;height:26px;border-radius:6px}.tour-poster.mono .kind-mark{background-size:13px 13px}
.tour-poster.mono{background:var(--cat-paper);border:2px solid var(--cat-ink);color:var(--cat-ink);transform:rotate(-3deg)}
.tour-poster.color{background:linear-gradient(135deg,#fde3cf,#e3e8fa);color:#c2532f;transform:rotate(2deg);margin-left:60px}
.tour-dots{display:flex;gap:6px;justify-content:center}.tour-dots i{width:7px;height:7px;border-radius:50%;background:#cfd5c3}.tour-dots i.on{width:20px;border-radius:4px;background:var(--green)}
.tour-actions{display:flex;gap:10px}.tour-actions .button{flex:1;min-height:48px;border-radius:999px;font-size:14px}
.news-sheet{gap:10px}.news-eyebrow{font-size:10px;letter-spacing:1.6px;font-weight:700;color:#5a7151}
.news-sheet h2{margin:0;font-family:Georgia,"Times New Roman",serif;font-weight:400;font-size:26px;color:#253d33}
.news-list{display:flex;flex-direction:column;gap:8px}
.news-item{display:flex;gap:12px;align-items:flex-start;padding:11px;border-radius:14px;background:#f6f5ef}
.news-icon{flex:none;width:40px;height:40px;border-radius:12px;display:grid;place-items:center;background:#fffef9;font-size:17px}
.news-item b{display:block;font-size:14px;color:#253d33}.news-item small{display:block;margin-top:2px;font-size:12.5px;line-height:1.4;color:#5f6b57}
.coach-tip{position:relative;margin:10px 0;padding:12px 14px;border-radius:16px;background:#253d33;color:#e6efe9;box-shadow:0 10px 30px #1b382c33;font-size:13px;line-height:1.45;flex:none;z-index:2}
.coach-tip b{display:block;margin-bottom:3px;font-size:14px;color:#fff}.coach-tip p{margin:0}
.coach-tip:after{content:'';position:absolute;left:var(--ax,50%);width:14px;height:14px;margin-left:-7px;background:#253d33;transform:rotate(45deg)}
.coach-tip.up:after{top:-6px}.coach-tip.down:after{bottom:-6px}
.coach-actions{display:flex;align-items:center;gap:10px;margin-top:10px;flex-wrap:wrap}
.coach-ok{min-height:40px;padding:0 18px;border-radius:999px;background:#fff;color:#253d33;font-weight:700;font-size:13px}
.coach-off{min-height:40px;margin-left:auto;padding:0 6px;font-size:12.5px;color:#c9d6cc;background:none}
.puzzle>.coach-tip{margin:6px 12px}
html[data-theme=dark] .learn-tour{background:linear-gradient(135deg,#22301f,#2c2618);border-color:#354039;color:#d3e3da}
html[data-theme=dark] .learn-tour small,html[data-theme=dark] .demo-big span,html[data-theme=dark] .tour-body p,html[data-theme=dark] .news-item small{color:#c2cabd}
html[data-theme=dark] .learn-tour-art,html[data-theme=dark] .news-icon{background:#1e2521}
html[data-theme=dark] .learn-coach,html[data-theme=dark] .demo-art{background:#1e2521f2;border-color:#354039}
html[data-theme=dark] .demo-big b,html[data-theme=dark] .tour-body h2,html[data-theme=dark] .news-sheet h2,html[data-theme=dark] .news-item b{color:#d8e8e0}
html[data-theme=dark] .tour-body li{color:#d3e3da}html[data-theme=dark] .tour-body li i{background:#30372b}
html[data-theme=dark] .tour-art.packs{background:#1f2a20}html[data-theme=dark] .tour-art.help,html[data-theme=dark] .tour-art.daily{background:#2c2618}html[data-theme=dark] .tour-art.own{background:#1d2633}
html[data-theme=dark] .news-item{background:#1b221e}
html[data-theme=dark] .coach-tip,html[data-theme=dark] .coach-tip:after{background:#d8e8e0}html[data-theme=dark] .coach-tip{color:#1d2420}html[data-theme=dark] .coach-tip b{color:#10251b}
html[data-theme=dark] .coach-ok{background:#1d2420;color:#d8e8e0}html[data-theme=dark] .coach-off{color:#3d5446}
.demo-actions{margin-top:auto}
.demo-view .lesson-text{margin:0}
.pack>.coach-tip,.view-inner>.coach-tip{margin:10px 16px}.done-inner>.coach-tip{margin:4px 0 8px;align-self:stretch}
.demo-view .lesson-head strong{white-space:normal;overflow:visible;text-overflow:clip;line-height:1.25}
/* e38 — демо из настоящих частей экрана поля: копии стоят в потоке, ничего не нажимается, нужное — в пульсирующем кольце. */
.demo-real{display:flex;flex-direction:column;align-items:center;gap:10px;width:100%;pointer-events:none;user-select:none}
.demo-real .action-dock{position:static;left:auto;bottom:auto;transform:none;margin:0;width:100%;max-width:440px;flex-wrap:wrap;justify-content:center}
.demo-real .dock-primary{flex:1 1 100%}
.demo-sheet{--cell:22px;--clue:12px;max-width:100%;overflow:hidden}
.demo-real .play-bar{width:100%;max-width:440px}
.demo-real .guess-bar{width:100%;max-width:440px;margin:0}
.demo-hint-area{position:relative;width:100%;max-width:440px}
.demo-real .hint-card{position:static;left:auto;bottom:auto;transform:none;width:100%;animation:none;box-shadow:none}
.demo-menu{width:100%;max-width:440px;display:flex;flex-direction:column;gap:6px}
.demo-real .zoom-menu{position:static;transform:none;display:flex}
.demo-real .play-keys{display:grid;width:100%;max-width:440px}
.demo-real .today-goal{width:100%;max-width:440px}
.demo-real .scanner-actions{width:100%;max-width:440px}
.demo-real .settings-toggle{width:100%;max-width:440px}
.demo-poster{min-height:0;width:100%;max-width:340px;padding:10px;gap:10px}.demo-poster .sets-poster-art{width:64px;height:64px;border-radius:12px}.demo-poster strong{font-family:Georgia,"Times New Roman",serif;font-weight:400;font-size:20px}
.demo-focus{position:relative;z-index:1;border-radius:12px;box-shadow:0 0 0 3px #fffef9,0 0 0 6px #d3ad54!important;animation:demo-focus 1.6s ease-in-out infinite}
@keyframes demo-focus{50%{box-shadow:0 0 0 3px #fffef9,0 0 0 10px #d3ad5440!important}}
html[data-theme=dark] .demo-focus{box-shadow:0 0 0 3px #181f1a,0 0 0 6px #e3c057!important}
.tour-art .demo-real{gap:8px}
/* Правила style.css, написанные для id частей экрана поля, — для их копий в демо (realPart). */
.demo-real .tool-caption{display:block}
.demo-real .dock-hint>.demo-hint-label{display:inline;font-size:12px;margin:0;vertical-align:0}
.demo-real .zoom-menu .demo-fit{min-width:72px;font-size:12px;font-variant-numeric:tabular-nums}
.demo-real .demo-hint-title{font-size:14px;font-weight:650;color:#30453b}
.demo-real .demo-hint-text{margin:0;font-size:13px;line-height:1.5;color:#4f5f47}
.demo-real .play-meta-line .demo-play-meta{display:block;overflow:hidden;text-overflow:ellipsis}
html[data-theme=dark] .demo-real .demo-hint-title{color:#d3e3da}html[data-theme=dark] .demo-real .demo-hint-text{color:#c9d2c5}
.demo-real .guess-bar{animation:none}
.tour-art .demo-sheet{--cell:18px;--clue:11px}.tour-art{min-height:0}

.board-viewport.panning .cell button{touch-action:pan-x pan-y;cursor:grab}.pan-glyph{width:20px;height:20px}
.cell button.photo-doubt{box-shadow:inset 0 0 0 2px #d89a3a}
/* The banner under the board while a puzzle is played (limits.py, ad_play): in the flow, so the board makes room for it. */
.play-ad{position:relative;flex:none;display:flex;flex-direction:column;margin:8px auto 0;width:min(100%,468px)}
.play-ad[hidden]{display:none}
.play-ad-slot{height:56px;border:1px dashed #c9cfbd;border-radius:10px;background:#f1f2ec;display:grid;place-items:center;overflow:hidden}
html[data-theme=dark] .play-ad-slot{border-color:#42453a;background:#161c18}

/* e39 — where to read a photo while the server has a queue */
.scan-place-options{display:flex;flex-direction:column;gap:8px}
.scan-place-options button,.scan-place-plus{display:flex;align-items:center;gap:10px;min-height:56px;padding:10px 14px;border-radius:14px;border:1px solid #e1e5d7;background:#fffef9;text-align:left;font:inherit;color:#30453b;cursor:pointer}
.scan-place-options button[aria-checked=true]{border:2px solid #295c47;background:#eef4e8}
.scan-place-options b,.scan-place-plus b{display:block;font-size:14px;color:#253d33}
.scan-place-options small,.scan-place-plus small{display:block;font-size:12px;color:#65715b;margin-top:2px}
.scan-place-options strong{margin-left:auto;font-size:15px;font-weight:800;color:#295c47;white-space:nowrap;font-variant-numeric:tabular-nums}
.scan-place-options strong.scan-place-slow{color:#b4782a}
.scan-place-plus{background:#fbf3e4;border-color:#efdcb8}.scan-place-plus>span:last-child{margin-left:auto;color:#295c47;font-weight:800}
.scan-place-remember{display:flex;align-items:center;justify-content:center;gap:8px;min-height:40px;font-size:13px;color:#5f6b57}
.loader-device{margin-top:4px}
html[data-theme=dark] .scan-place-options button,html[data-theme=dark] .scan-place-plus{background:#22302a;border-color:#34443c;color:#d8e8e0}
html[data-theme=dark] .scan-place-options button[aria-checked=true]{background:#2a3d33;border-color:#8fc4a5}
html[data-theme=dark] .scan-place-options b,html[data-theme=dark] .scan-place-plus b{color:#d8e8e0}
html[data-theme=dark] .scan-place-options small,html[data-theme=dark] .scan-place-plus small,html[data-theme=dark] .scan-place-remember{color:#c2cabd}
html[data-theme=dark] .scan-place-options strong{color:#8fc4a5}html[data-theme=dark] .scan-place-plus{background:#3a3222;border-color:#5a4a2c}
html[data-theme=dark] .scan-place-options strong.scan-place-slow{color:#e0a72e}
.scan-job{border-style:dashed;background:#f7f8f1}
.scan-job.failed{border-color:#e6b8ac}
.scan-job-thumb{display:grid;place-items:center}
.scan-job.queued .scan-job-thumb:after,.scan-job.running .scan-job-thumb:after{content:"";width:18px;height:18px;border-radius:50%;border:3px solid #d7dccd;border-top-color:#295c47;animation:scan-job-spin 1s linear infinite}
@keyframes scan-job-spin{to{transform:rotate(360deg)}}
.scan-job-state{display:inline-flex;padding:2px 8px;border-radius:999px;font-size:11px;font-weight:700;background:#eceee6;color:#5f6b57}
.scan-job.failed .scan-job-state{background:#fbe4df;color:#a2402e}
.scan-job-state.fresh{background:#e3eedb;color:#295c47}
.library-entry .scan-job-cancel{font-size:16px;color:#5f6b57}
.library-entry .scan-job-retry{position:absolute;right:8px;top:50%;transform:translateY(-50%);min-height:40px;padding:0 14px}
.library-entry:has(.scan-job-retry) .library-item{padding-right:120px}
html[data-theme=dark] .scan-job{background:#1a201d}
html[data-theme=dark] .scan-job-state{background:#2b342f;color:#c2cabd}
html[data-theme=dark] .scan-job.failed .scan-job-state{background:#4a2a24;color:#f0b4a6}
html[data-theme=dark] .scan-job-state.fresh{background:#2a3d33;color:#8fc4a5}