@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@500;650;750;800&display=swap');
:root{--paper:#f6f5f0;--ink:#242c28;--muted:#676e65;--line:#dcdfd4;--purple:#7260b5;--green:#c2f46b}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font:15px 'DM Sans',sans-serif}button,a,input{touch-action:manipulation}button{font:inherit;cursor:pointer;color:inherit;background:#fffefa;border:1px solid var(--line);border-radius:8px;padding:10px 14px}button:hover{background:#eae7f1}a{color:inherit}button:focus-visible,a:focus-visible{outline:3px solid var(--purple);outline-offset:3px}header{max-width:1320px;margin:auto;padding:28px 40px;display:flex;align-items:center;justify-content:space-between;gap:15px;border-bottom:1px solid var(--line);font-size:13px}header a{text-decoration:none}.brand{display:flex;align-items:center;gap:8px;font:800 30px Manrope}.brand>span{color:var(--purple);margin-left:-8px}.brand strong{font-size:23px;margin-left:3px}.version{font-size:10px;padding:5px 7px;margin-left:9px;background:transparent}main{max-width:1180px;margin:auto;padding:0 30px}.intro{display:flex;align-items:center;justify-content:space-between;padding:40px 0 32px}.eyebrow{font-size:10px;letter-spacing:1.8px;font-weight:700;color:var(--purple)}h1{font:750 clamp(32px,4.5vw,52px)/1.1 Manrope,sans-serif;letter-spacing:-2px;margin:14px 0}em{font-style:normal;color:var(--purple)}.intro p:last-child{color:var(--muted);line-height:1.7}.hero-mark{font-size:100px;color:var(--purple);padding-right:30px}nav{display:grid;grid-template-columns:repeat(6,1fr);gap:9px;margin-bottom:24px}nav button{text-align:left;display:flex;flex-direction:column;gap:10px;padding:16px;font-size:12px}nav button span{font-size:20px;color:var(--purple)}nav button[aria-pressed=true]{background:var(--ink);border-color:var(--ink);color:white}nav button[aria-pressed=true] span{color:var(--green)}.workspace{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(260px,1fr);border:1px solid var(--line);border-radius:16px;overflow:hidden;background:#fffefa}.play-area{padding:28px 34px;border-right:1px solid var(--line);min-width:0}.board-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:22px}h2{font:750 26px Manrope;letter-spacing:-.8px;margin:8px 0}.badge{font:10px monospace;border:1px solid var(--line);padding:7px 9px;border-radius:5px;color:var(--muted)}.board-wrap{max-width:480px;margin:auto}#board{display:grid;grid-template-columns:repeat(var(--n),minmax(0,1fr));border:2px solid var(--ink);background:var(--ink);gap:0;aspect-ratio:1;isolation:isolate}.cell{border:0;border-right:1px solid #d4d7cc;border-bottom:1px solid #d4d7cc;border-radius:0;padding:0;position:relative;min-width:0;min-height:0;display:flex;align-items:center;justify-content:center;font:500 clamp(17px,2.8vw,27px) Manrope;background:#fffefa;color:var(--purple)}.cell.given{background:#f0f1e9;color:var(--ink);font-weight:800}.cell.selected{background:#e5dcfa;box-shadow:inset 0 0 0 3px var(--purple);z-index:2}.cell.error{background:#ffe0d8;color:#a92920}.cell.block{background:var(--ink);color:white;cursor:default}.cell .clue{position:absolute;top:3px;left:4px;font:700 clamp(9px,1vw,12px) 'DM Sans';color:var(--ink)}.cell .sum-down{position:absolute;bottom:3px;left:5px;font-size:12px;color:#e0e7c9}.cell .sum-right{position:absolute;right:4px;top:3px;font-size:12px;color:#e0e7c9}.cell.block:has(.sum-down,.sum-right){background:linear-gradient(40deg,transparent 49%,#ffffff50 50%,transparent 51%),var(--ink)}.cell .inequality{position:absolute;z-index:4;background:#fffefa;color:var(--purple);font:bold 18px monospace;border-radius:3px;line-height:18px}.inequality.right{right:-9px;top:calc(50% - 9px)}.inequality.down{bottom:-10px;left:calc(50% - 9px);transform:rotate(90deg)}.cell.color .ball{width:66%;height:66%;border-radius:50%;background:var(--ball);display:grid;place-items:center;color:var(--ball-ink);font-size:16px;border:2px solid #00000030;box-shadow:inset 0 2px 4px #ffffff60}.cell.color.given .ball{border:3px solid var(--ink)}.cell.mine{background:#dedfce;box-shadow:inset 2px 2px #ffffffb0,inset -2px -2px #00000018;font-size:20px}.cell.mine.open{background:#f7f6ef;box-shadow:none}.cell.mine[data-value='1']{color:#375fa9}.cell.mine[data-value='2']{color:#387142}.cell.mine[data-value='3']{color:#b83f34}#palette{display:flex;justify-content:center;gap:6px;flex-wrap:wrap;margin:20px 0 12px}#palette button{width:40px;height:43px;padding:0;font-weight:700;color:var(--purple)}#palette button.color-choice{background:var(--ball);color:var(--ball-ink);border:2px solid #00000030;border-radius:50%}.actions{display:flex;justify-content:center;gap:8px;flex-wrap:wrap}.actions button{font-size:12px;padding:9px 14px}#status{text-align:center;min-height:36px;font-size:12px;color:var(--purple);line-height:1.6}.mine-tools{display:flex;justify-content:space-between;align-items:center;margin:20px 0;font-size:12px}.mine-tools [aria-pressed=true]{background:var(--ink);color:var(--green)}aside{padding:35px 30px;background:#f0f1e9}aside>p:not(.eyebrow){font-size:13px;line-height:1.8;color:var(--muted)}aside h2{font-size:29px;line-height:1.25;margin-top:20px}.rules{border-top:1px solid var(--line);margin-top:24px;padding-top:10px}.rules h3{font-size:13px}.rules p{font-size:12px;line-height:1.85;color:var(--muted)}.session{margin:25px 0;display:flex;flex-direction:column;gap:7px;font-size:13px}.session small{font-size:10px;color:var(--muted)}.primary{background:var(--ink);color:white;display:flex;justify-content:space-between;align-items:center;gap:20px}.primary:hover{background:#414c42}.primary span{color:var(--green);font-size:20px}aside .primary{width:100%}.quiet{border:0;background:none;width:100%;font-size:12px;margin-top:7px}.note{font-size:10px!important}footer{display:flex;justify-content:space-between;gap:15px;padding:30px 0;font-size:11px;color:var(--muted)}dialog{width:calc(100% - 32px);max-width:540px;border:1px solid var(--line);background:var(--paper);color:var(--ink);border-radius:16px;padding:28px}dialog::backdrop{background:#18201988;backdrop-filter:blur(4px)}dialog li,dialog p{font-size:13px;line-height:1.8}.close{float:right}dialog .actions{margin-top:25px}[hidden]{display:none!important}@media(max-width:800px){header{padding:20px}.brand strong{font-size:18px}header>div{font-size:12px}.version{display:block;margin:5px 0 0}main{padding:0 20px}.workspace{grid-template-columns:1fr}.play-area{border-right:0;border-bottom:1px solid var(--line);padding:24px}aside{padding:25px}.hero-mark{font-size:70px;padding:0}.intro{padding-top:30px}nav{grid-template-columns:repeat(3,1fr)}nav button{flex-direction:row;align-items:center;gap:12px}.cell{font-size:24px}aside h2{margin-top:12px}.rules{margin-top:16px}footer{flex-direction:column}}@media(max-width:430px){header{gap:8px;padding:16px 12px}.brand{font-size:24px;gap:4px}.brand strong{font-size:15px}header>a:last-child{font-size:11px}main{padding:0 12px}.hero-mark{display:none}h1{font-size:36px}.intro p:last-child{font-size:13px}nav{gap:6px}nav button{font-size:11px;padding:10px 8px;gap:7px}.play-area{padding:18px 12px}.cell{font-size:22px}.cell.color .ball{font-size:12px}.cell .clue{font-size:10px}.cell .sum-down,.cell .sum-right{font-size:11px}#palette{gap:4px}#palette button{width:31px;height:35px}.actions{gap:5px}.actions button{padding:9px 12px}}

.difficulty-bar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:0 0 22px;font-size:12px}.difficulty-bar label{font-weight:700}.difficulty-bar select{font:inherit;color:var(--ink);background:var(--paper);border:1px solid var(--line);border-radius:7px;padding:8px 28px 8px 10px}.difficulty-bar select:focus-visible{outline:3px solid var(--purple);outline-offset:3px}.difficulty-bar span{color:var(--muted);font-size:10px}

.entry-tools{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:0 0 16px}.entry-tools button{font-size:12px}.entry-tools button[aria-pressed=true]{background:var(--ink);color:var(--green);border-color:var(--ink)}.entry-tools span{font-size:10px;color:var(--muted)}.candidates{position:absolute;inset:3px;display:grid;grid-template-columns:repeat(var(--cols),1fr);grid-template-rows:repeat(var(--cols),1fr);align-items:center;justify-items:center;font:600 clamp(8px,1vw,12px)/1 'DM Sans',sans-serif;color:var(--purple);pointer-events:none}.candidates.cage-notes{top:19px}.candidates>span{display:grid;place-items:center;width:100%;height:100%;min-height:0}.candidates .color-note{width:85%;height:85%;border-radius:50%;background:var(--ball);color:var(--ball-ink);border:1px solid #00000035}.cell .clue{z-index:1}

.assistance{display:flex;align-items:center;gap:10px 15px;flex-wrap:wrap;font-size:11px;margin:12px 0 18px}.assistance label{display:flex;align-items:center;gap:5px}.assistance select{max-width:120px;font:inherit;padding:5px;border:1px solid var(--line);border-radius:6px}.assistance output{color:var(--purple);font-variant-numeric:tabular-nums}.collection-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:18px}.collection-actions button{font-size:11px}.cell.matching-value{background:#eef4c7;box-shadow:inset 0 0 0 2px #7b8e37}.candidates .matching-note{outline:2px solid var(--purple);outline-offset:-1px;background:#e5dcfa}.cell.error{background:#ffe0d8;box-shadow:inset 0 0 0 2px #a92920}.cell.selected{box-shadow:inset 0 0 0 3px var(--purple)}dialog{max-height:90vh;overflow:auto}#share-link{display:block;width:100%;margin:12px 0;padding:10px;border:1px solid var(--line);background:white;border-radius:6px}#completion-list{padding-left:22px}#completion-list li{margin:14px 0}.candidates.cage-notes{top:16px}.entry-tools button{min-height:36px}
@media print{
 @page{size:A4 portrait;margin:16mm}
 body{background:white;color:black;font-family:Arial,sans-serif;-webkit-print-color-adjust:exact;print-color-adjust:exact}
 header,.intro,nav,.assistance,.entry-tools,#palette,.actions,#status,.mine-tools,aside,footer,dialog,#notes-warning,.version,button#new{display:none!important}
 main{padding:0;max-width:none}.workspace{display:block;border:0;overflow:visible}.play-area{padding:0;border:0}.board-heading{margin:0 0 8mm}.board-wrap{max-width:160mm;width:160mm;margin:auto}#board{width:160mm;height:160mm;aspect-ratio:1;border:2px solid black}.cell{background:white!important;color:black!important;box-shadow:none!important;font-size:20pt}.cell.given{background:#eee!important}.cell.block{background:#242c28!important}.cell .clue{font-size:9pt}.cell .sum-right,.cell .sum-down{font-size:10pt}.cell .inequality{font-size:14pt}.candidates{display:none!important}.difficulty-bar select{appearance:none;border:0;background:none;color:black;padding:0}.difficulty-bar{margin-bottom:3mm}.cell.color .ball{font-size:14pt}#source{margin-bottom:6mm}.cell .sum-down,.cell .sum-right{color:white!important}
}

.print-only{display:none}@media print{.print-only{display:block;font-size:9pt;color:black}}

#print-dialog{max-width:740px}#print-caption{font-size:10px}#print-board{display:grid;grid-template-columns:repeat(var(--n),minmax(0,1fr));border:2px solid var(--ink);width:100%;aspect-ratio:1;isolation:isolate}#print-board .cell{font-size:22px}#print-board .clue{font-size:10px}#print-board .candidates{display:none}
@media print{body:has(#print-dialog[open]) main{display:none!important}dialog#print-dialog[open]{display:block!important;position:static;border:0;padding:0;margin:0;max-height:none;overflow:visible;width:100%;max-width:none}#print-dialog .close,#print-dialog .print-actions{display:none!important}#print-board{width:160mm;height:160mm;margin:auto}#print-board .cell{font-size:20pt}}
#board,#print-board{grid-template-rows:repeat(var(--n),minmax(0,1fr))}

.candidates .color-note.matching-note{background:var(--ball);outline:2px solid var(--ink)}@media print{#pf-privacy-links,#pf-privacy-banner,#pf-privacy-dialog{display:none!important}}

#difficulty-preset{display:inline-flex;align-items:center;gap:10px}.ladder-controls{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:0 0 18px;padding:14px;border:1px solid var(--line);background:#eef1e5;border-radius:10px}.ladder-controls label{font-size:12px}.ladder-controls input[type=number]{width:65px;padding:9px 5px;font:inherit;border:1px solid var(--line);border-radius:6px;background:white;color:var(--ink)}.ladder-controls button{font-size:11px;padding:8px 10px}.collection-actions #ladder-open{grid-column:1/-1;background:var(--ink);color:var(--green);font-weight:700}.ladder-controls input:focus-visible{outline:3px solid var(--purple);outline-offset:3px}@media print{.ladder-controls{display:none!important}}

#ladder-open{background:var(--ink);color:var(--green);font-size:12px;font-weight:700;padding:9px 12px}#ladder-exit{background:transparent;color:var(--purple)}

.ladder-controls .auto-advance{display:flex;align-items:center;gap:7px;flex-basis:100%;font-size:12px;margin-top:4px}.auto-advance input{accent-color:var(--purple)}

.ladder-count{flex-basis:100%;font-size:13px;font-weight:700}#ladder-continue{background:var(--ink);color:var(--green)}
#ladder-progress-dialog{width:min(720px,calc(100vw - 32px));box-sizing:border-box}#ladder-progress-games{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:18px 0}#ladder-progress-games button{font-size:12px;padding:10px 5px}#ladder-progress-games button[aria-pressed=true]{background:var(--ink);color:var(--green)}
#ladder-progress-grid{display:grid;grid-template-columns:repeat(10,minmax(0,1fr));gap:6px;margin:18px 0}#ladder-progress-grid button{padding:9px 0;font-size:12px;min-width:0}#ladder-progress-grid .completed{background:#dceacb;color:#243526;font-weight:700}#ladder-progress-grid [aria-current=true]{outline:3px solid var(--purple);outline-offset:1px}#progress-continue{width:100%}
@media(max-width:480px){#ladder-progress-games{grid-template-columns:repeat(2,minmax(0,1fr))}#ladder-progress-grid{grid-template-columns:repeat(5,minmax(0,1fr))}}
#games{grid-template-columns:repeat(5,minmax(0,1fr))}#games button{min-width:0;font-size:12px;padding:12px 3px}#collection-v3{box-sizing:border-box;width:760px;max-width:calc(100vw - 24px);max-height:90vh;padding:28px}#collection-v3 h2{padding-right:35px}#collection-v3 .collection-tabs{display:flex;flex-wrap:wrap;gap:6px;margin:18px 0}#collection-v3 button{font-size:12px}#collection-v3 button[aria-pressed=true]{background:var(--ink);color:var(--green)}.progress-games{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px}.progress-games button{padding:10px 4px;font-size:11px!important}.progress-grid{display:grid;grid-template-columns:repeat(10,minmax(0,1fr));gap:6px;margin:18px 0}.progress-grid a{display:block;text-align:center;padding:10px 0;background:white;border:1px solid var(--line);border-radius:6px;text-decoration:none;color:var(--ink);font-size:12px}.progress-grid .completed{background:#dceacb;font-weight:700}.progress-grid [aria-current=true]{outline:3px solid var(--purple);outline-offset:1px}.collection-go{display:block;text-align:center;text-decoration:none;padding:12px;border-radius:8px}.bookmark-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 0;border-bottom:1px solid var(--line)}#collection-v3 textarea{display:block;width:100%;box-sizing:border-box;margin:14px 0;padding:12px;font:12px monospace}#collection-v3 table{width:100%;border-collapse:collapse;font-size:13px}#collection-v3 th,#collection-v3 td{text-align:left;padding:10px 6px;border-bottom:1px solid var(--line)}#collection-v3 details{padding:16px 0;border-bottom:1px solid var(--line)}#collection-v3 summary{cursor:pointer;font-weight:700}#collection-v3 pre{white-space:pre-wrap;font-size:15px;padding:14px;background:#eef1e5}.lesson-answers{display:flex;gap:8px;flex-wrap:wrap}#collection-v3 a:focus-visible{outline:3px solid var(--purple);outline-offset:2px}@media(max-width:600px){#games{grid-template-columns:repeat(2,minmax(0,1fr))}.progress-games{grid-template-columns:repeat(2,minmax(0,1fr))}.progress-grid{grid-template-columns:repeat(5,minmax(0,1fr))}#collection-v3{padding:20px}#collection-v3 table{font-size:11px}#collection-v3 th,#collection-v3 td{padding:8px 2px}}
#games a{display:flex;align-items:center;justify-content:center;padding:12px 4px;border:1px solid var(--line);border-radius:8px;text-decoration:none;color:var(--ink);font-size:12px;background:white;text-align:center}#games a[aria-current=page]{background:var(--ink);color:var(--green)}.spatial-board{margin:28px auto;max-width:480px;aspect-ratio:1;position:relative;touch-action:manipulation}.loop-field,.bridge-field{position:absolute;inset:10px}.loop-clue,.loop-dot{position:absolute;transform:translate(-50%,-50%);pointer-events:none}.loop-clue{font-size:clamp(16px,3vw,26px);font-weight:700}.loop-dot{font-size:22px;z-index:3}.loop-edge{position:absolute;transform:translate(-50%,-50%);padding:0;border:0;border-radius:0;background:transparent;z-index:2;color:#8b65b4;font-size:18px}.loop-edge.horizontal{width:var(--length);height:26px}.loop-edge.vertical{width:26px;height:var(--length)}.loop-edge::before{content:'';position:absolute;background:#e0dfd6;pointer-events:none}.loop-edge.horizontal::before{height:2px;left:0;right:0;top:50%}.loop-edge.vertical::before{width:2px;top:0;bottom:0;left:50%}.loop-edge.drawn::before{background:var(--ink)}.loop-edge.horizontal.drawn::before{height:5px}.loop-edge.vertical.drawn::before{width:5px}.loop-edge:focus-visible{outline:3px solid var(--purple);outline-offset:0}.island{position:absolute;transform:translate(-50%,-50%);width:38px;height:38px;border-radius:50%;padding:0;border:2px solid var(--ink);font-size:18px;font-weight:700;background:#faf9f4;z-index:4}.selected{outline:3px solid var(--purple);outline-offset:-3px}.bridge-path{position:absolute;transform:translate(-50%,-50%);padding:0;border:0;border-radius:0;background:transparent;font-size:0;z-index:2}.bridge-path::before{content:'';position:absolute;pointer-events:none}.bridge-path.horizontal::before{left:0;right:0;top:50%;border-top:2px dotted #cfcec3}.bridge-path.vertical::before{top:0;bottom:0;left:50%;border-left:2px dotted #cfcec3}.bridge-path.horizontal.count1::before{border-top:4px solid var(--ink)}.bridge-path.horizontal.count2::before{border-top:8px double var(--ink)}.bridge-path.vertical.count1::before{border-left:4px solid var(--ink)}.bridge-path.vertical.count2::before{border-left:8px double var(--ink)}.spatial-board.nurikabe,.spatial-board.shikaku{display:grid;grid-template-columns:repeat(var(--n),minmax(0,1fr));grid-template-rows:repeat(var(--n),minmax(0,1fr));border:2px solid var(--ink)}.spatial-cell{min-width:0;min-height:0;padding:0;border:1px solid #b8bcb0;border-radius:0;background:#faf9f4;font-size:clamp(18px,3vw,28px);font-weight:700}.spatial-cell.sea{background:#273d49;color:#a4c3cb}.spatial-cell.land{background:#eef3dc}.spatial-cell.unknown{background:#e2e1da}.spatial-cell:focus-visible{outline:3px solid var(--purple);outline-offset:-3px;z-index:2}@media(max-width:480px){.spatial-board{max-width:100%;margin:24px 0}.island{width:32px;height:32px;font-size:16px}.loop-field,.bridge-field{inset:12px}}@media print{#collection-v3{display:none}}
#collection-v3 input[type=password],#collection-v3 input[readonly]{box-sizing:border-box;display:block;width:100%;padding:12px;margin:12px 0;font:14px monospace;border:1px solid var(--line);border-radius:6px}#collection-v3>div>button{margin:4px 6px 4px 0}#device-sync[title]{border-color:var(--purple)}
