/* ficklestudio26 · Printable Sudoku Generator */
:root { --ink:#1d1d22; --ink2:#5b5b66; --line:#e8e8ec; --bg:#fafafb; --accent:#3b5bdb; }
* { box-sizing:border-box; }
body { margin:0; background:var(--bg); color:var(--ink); font:16px/1.6 system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif; }
.wrap { max-width:1100px; margin:0 auto; padding:0 16px; }
h1 { font-size:clamp(26px,4vw,38px); line-height:1.2; margin:28px 0 8px; letter-spacing:-.02em; }
.lead { color:var(--ink2); margin:0 0 20px; max-width:760px; }
.tool { display:grid; grid-template-columns:300px 1fr; gap:20px; align-items:start; }
@media (max-width:820px) { .tool { grid-template-columns:1fr; } }
.panel { background:#fff; border:1px solid var(--line); border-radius:14px; padding:16px; position:sticky; top:12px; }
@media (max-width:820px) { .panel { position:static; } }
.panel label { display:block; font-size:13px; font-weight:600; margin:10px 0 4px; }
.panel input[type=text], .panel select { width:100%; padding:8px 10px; border:1px solid var(--line); border-radius:8px; font:inherit; background:#fff; }
.row2 { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.chk { display:flex; gap:8px; align-items:center; font-weight:500 !important; margin:8px 0 !important; }
.actions { display:grid; gap:8px; margin-top:16px; }
.btn { padding:11px 14px; border-radius:10px; border:1px solid var(--line); background:#fff; font:600 15px system-ui,sans-serif; cursor:pointer; }
.btn.primary { background:var(--accent); border-color:var(--accent); color:#fff; }
.btn:disabled { opacity:.55; cursor:default; }
.small { font-size:12.5px; color:var(--ink2); margin:6px 0 0; }
.preview-head { display:flex; justify-content:space-between; align-items:baseline; margin:0 0 8px; color:var(--ink2); font-size:14px; }

#sheets { display:grid; gap:18px; }
.sd-page { background:#fff; border:1px solid var(--line); border-radius:6px; box-shadow:0 1px 3px rgba(0,0,0,.06); aspect-ratio:var(--ratio,8.5 / 11); container-type:inline-size; overflow:hidden; color:#1d1d22; display:flex; flex-direction:column; }
#sheets .sd-page { padding:var(--pad,5.9cqw); }
.sd-page header { display:flex; justify-content:space-between; align-items:flex-end; gap:3cqw; padding-bottom:1.4cqw; margin-bottom:2cqw; border-bottom:.3cqw solid var(--accent); }
.sd-page h2 { margin:0; font-size:4cqw; line-height:1; color:var(--accent); }
.sd-page .nd { display:flex; align-items:flex-end; gap:1cqw; font-size:2cqw; color:#6b6b76; flex:1; justify-content:flex-end; }
.sd-page .nd i { display:block; border-bottom:1px solid #8b8b96; width:22cqw; height:1px; }
.sd-grid { flex:1; display:grid; gap:2cqw; align-content:space-evenly; justify-items:center; min-height:0; }
.sd-grid.pp1 { grid-template-columns:1fr; --w:70cqw; }
.sd-grid.pp2 { grid-template-columns:1fr; --w:48cqw; }
.sd-grid.pp4 { grid-template-columns:1fr 1fr; --w:38cqw; }
.sd-grid.pp6 { grid-template-columns:1fr 1fr; --w:34cqw; }
.sd-grid figure { margin:0; display:flex; flex-direction:column; gap:.8cqw; }
.sd-grid figcaption { font-size:1.9cqw; font-weight:600; color:#44444d; }
.sg { width:var(--w,40cqw); aspect-ratio:1; display:grid; border:.4cqw solid #1d1d22; }
.sg.n9 { grid-template-columns:repeat(9,1fr); grid-template-rows:repeat(9,1fr); }
.sg.n4 { grid-template-columns:repeat(4,1fr); grid-template-rows:repeat(4,1fr); }
.sg .c { display:flex; align-items:center; justify-content:center; border-right:1px solid #9a9aa5; border-bottom:1px solid #9a9aa5; font-weight:600; font-size:calc(var(--w,40cqw) / 9 * .62); line-height:1; }
.sg.n4 .c { font-size:calc(var(--w,40cqw) / 4 * .6); }
.sg .c.br { border-right:.4cqw solid #1d1d22; }
.sg .c.bb { border-bottom:.4cqw solid #1d1d22; }
.sg .c:nth-child(9n), .sg.n4 .c:nth-child(4n) { border-right:0; }
.sg .c.ans { color:var(--accent); font-weight:500; }

.seo { max-width:780px; margin:36px 0 12px; }
.seo h2 { font-size:22px; margin:28px 0 8px; }
.seo details { border:1px solid var(--line); border-radius:10px; padding:10px 14px; margin:8px 0; background:#fff; }
.seo summary { cursor:pointer; font-weight:600; }
.related a { margin-right:14px; }

#wait[hidden] { display:none; }
#wait { position:fixed; inset:0; background:rgba(15,15,25,.55); display:flex; align-items:center; justify-content:center; padding:16px; z-index:50; }
.wait__card { background:#fff; border-radius:16px; padding:22px; max-width:420px; width:100%; text-align:center; }
.wait__card h2 { margin:0 0 6px; font-size:20px; }
.wait__card p { margin:0 0 12px; color:var(--ink2); font-size:14px; }
.wait__count { font-size:34px; font-weight:800; margin:4px 0 10px; }
.wait__card .btn { width:100%; margin-top:8px; }
.wait__card .ad-slot.is-on { margin:12px auto; }

#print-root { display:none; }
@media print {
  body > *:not(#print-root):not(#page-style) { display:none !important; }
  #print-root { display:block; }
  html, body { background:#fff; }
  #print-root .sd-page { border:0; border-radius:0; box-shadow:none; aspect-ratio:auto; padding:0; page-break-after:always; break-after:page; overflow:hidden; }
  #print-root .sd-page:last-child { page-break-after:auto; break-after:auto; }
}