@font-face{font-family:Ubuntu;font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/ubuntu-400.woff2) format("woff2")}@font-face{font-family:Ubuntu;font-style:normal;font-weight:500;font-display:swap;src:url(/fonts/ubuntu-500.woff2) format("woff2")}@font-face{font-family:Ubuntu;font-style:normal;font-weight:700;font-display:swap;src:url(/fonts/ubuntu-700.woff2) format("woff2")}@font-face{font-family:"Source Sans 3";font-style:normal;font-weight:200 900;font-display:swap;src:url(/fonts/source-sans-3.woff2) format("woff2")}:root{--font-main: "Ubuntu", system-ui, -apple-system, sans-serif;--font-secondary: "Source Sans 3", "Source Sans Pro", system-ui, sans-serif}*{box-sizing:border-box;margin:0;padding:0}html{-webkit-text-size-adjust:100%}body{font-family:var(--font-main);color:#efe3cf;background:radial-gradient(120% 90% at 50% 0%,rgba(255,214,150,.07),transparent 60%),radial-gradient(140% 120% at 50% 110%,#0d0a07 20%,transparent 70%),linear-gradient(180deg,#262019,#1c1712 55%,#14100c);min-height:100vh;min-height:100dvh;-webkit-font-smoothing:antialiased;user-select:none;-webkit-user-select:none;-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}button:disabled{cursor:default}.app{--code-length: 4;--fb-cols: 2;--overhead: calc(8rem + var(--fb-cols) * 1.1rem);--want-width: calc(var(--overhead) + var(--code-length) * 2.65rem);--hole-w: calc((100vw - var(--overhead)) / (var(--code-length) * 1.26));--hole: clamp(.95rem, min(4.1dvh, var(--hole-w)), 2.1rem);--peg: calc(var(--hole) * .88);--peg-lg: clamp(1.85rem, 5dvh, 2.4rem);--fb: clamp(.5rem, min(1.7dvh, calc(var(--hole) * .42)), .8rem);--row-pad-y: clamp(.12rem, .45dvh, .32rem);max-width:min(100vw,max(27rem,var(--want-width)));margin:0 auto;height:100vh;height:100dvh;overflow:hidden;padding:max(env(safe-area-inset-top),clamp(.35rem,1dvh,.75rem)) .9rem max(env(safe-area-inset-bottom),clamp(.4rem,1.2dvh,1.25rem));display:flex;flex-direction:column;align-items:stretch}.header,.status,.tray,.legend{flex-shrink:0}.app--loading{align-items:center;padding-top:40vh;color:#b39b78}.header{display:flex;align-items:center;justify-content:space-between;padding:.15rem .15rem clamp(.2rem,.8dvh,.5rem)}.header__actions{display:flex;align-items:center;gap:.45rem}.btn--icon{padding-left:.6rem;padding-right:.6rem;font-size:1.05rem;line-height:1}.title{font-size:clamp(1.15rem,3dvh,1.55rem);font-weight:700;letter-spacing:.12em;font-variant:small-caps;color:#dfb877;text-shadow:0 2px 4px rgba(0,0,0,.6)}.status{text-align:center;font-family:var(--font-secondary);font-size:clamp(.8rem,1.9dvh,.92rem);color:#c9b491;letter-spacing:.05em;padding-bottom:clamp(.25rem,.9dvh,.6rem)}.board{display:flex;flex-direction:column;flex:0 1 auto;min-height:0;border-radius:18px;padding:clamp(.45rem,1.2dvh,.9rem) .85rem clamp(.4rem,1dvh,.75rem);background:url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='420' height='420'><filter id='wood'><feTurbulence type='fractalNoise' baseFrequency='0.011 0.13' numOctaves='4' seed='11'/><feColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.9 0.35 0 0 0'/></filter><rect width='100%25' height='100%25' filter='url(%23wood)' opacity='0.28'/></svg>"),repeating-linear-gradient(93deg,#5a34141f,#5a341400 7px,#ffdaaa0d 13px,#5a34141a 21px),linear-gradient(105deg,#a06a38,#8a5729 35%,#96633a 62%,#7c4d22);border:3px solid #5b3a1a;box-shadow:inset 0 2px 3px #ffe2b459,inset 0 -3px 6px #2312058c,inset 3px 0 5px #ffe2b41f,inset -3px 0 5px #23120559,0 10px 28px #0000008c,0 2px 6px #0006}.secret-row{display:flex;flex-shrink:0;align-items:center;gap:.75rem;padding:clamp(.22rem,.7dvh,.45rem) .7rem;margin-bottom:clamp(.3rem,.9dvh,.65rem);border-radius:12px;background:linear-gradient(180deg,#5d3a19,#4c2e12);border:1px solid #3a2109;box-shadow:inset 0 2px 5px #140a02b3,0 1px #ffe0b22e}.secret-row__label{font-variant:small-caps;letter-spacing:.14em;font-size:.8rem;color:#d8b578;min-width:2.6rem}.secret-row__pegs{display:flex;gap:calc(var(--hole) * .26);align-items:center}.secret-cover{width:var(--hole);height:var(--hole);border-radius:50%;display:inline-flex;align-items:center;justify-content:center;font-size:calc(var(--hole) * .5);font-weight:700;color:#caa25e;background:linear-gradient(145deg,#7a4f24,#5a3714 60%,#4a2c0e);border:1px solid #3c240c;box-shadow:inset 0 1px 1px #ffe2b466,inset 0 -2px 3px #190c0299,0 1px 2px #00000080;text-shadow:0 1px 1px rgba(0,0,0,.6)}.rows{display:flex;flex-direction:column;flex:0 1 auto;min-height:0;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:rgba(59,35,12,.75) transparent}.rows::-webkit-scrollbar{width:6px}.rows::-webkit-scrollbar-thumb{background:#3b230cbf;border-radius:3px}.row{display:flex;align-items:center;gap:.6rem;padding:var(--row-pad-y) .45rem;border-radius:10px}.row+.row{border-top:1px solid rgba(46,24,6,.35)}.row--active{background:linear-gradient(180deg,#ffd88c1f,#ffd88c0d);box-shadow:inset 0 0 0 2px #ebc36e66,inset 0 0 14px #ffd2821f}.row__num{width:1.3rem;text-align:center;font-size:.8rem;color:#f6e4c0eb;font-weight:700;text-shadow:0 1px 2px rgba(20,10,2,.75),0 0 4px rgba(20,10,2,.35)}.row__slots{display:flex;gap:calc(var(--hole) * .26);flex:1;justify-content:center}.slot{position:relative;width:var(--hole);height:var(--hole);border-radius:50%;display:inline-flex;align-items:center;justify-content:center;background:radial-gradient(circle at 40% 32%,#2a1a0c,#170d04 72%);box-shadow:inset 0 3px 6px #000000d9,inset 0 -1px 2px #ffd29624,0 1px #ffe0b229}button.slot{border:none;padding:0;flex-shrink:0}.slot--selected:after{content:"";position:absolute;top:-3px;right:-3px;bottom:-3px;left:-3px;border-radius:50%;border:2px solid rgba(255,246,225,.9);box-shadow:0 0 10px #ffeec38c,inset 0 0 6px #ffeec359;animation:ring-pulse 1.5s ease-in-out infinite;pointer-events:none}@keyframes ring-pulse{0%,to{opacity:1}50%{opacity:.45}}.peg{width:var(--peg);height:var(--peg);border-radius:50%;border:none;padding:0;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;background:radial-gradient(circle at 32% 26%,#ffffffd9,#fff0 30%),radial-gradient(circle at 50% 42%,var(--c-light),var(--c) 58%,var(--c-dark) 100%);box-shadow:0 2px 4px #00000080,inset 0 -2px 4px #0000004d;animation:peg-pop .16s ease-out}.peg--lg{width:var(--peg-lg);height:var(--peg-lg)}.peg--sm{width:1.2rem;height:1.2rem;animation:none}button.peg:not(:disabled):active{transform:scale(.92)}.peg__num{font-family:var(--font-main);font-size:calc(var(--peg) * .5);font-weight:700;line-height:1;color:#fffffff2;text-shadow:0 1px 2px rgba(0,0,0,.75),0 0 3px rgba(0,0,0,.4);pointer-events:none;user-select:none;-webkit-user-select:none}.peg--lg .peg__num{font-size:calc(var(--peg-lg) * .46)}.peg--sm .peg__num{font-size:.62rem}.peg--white .peg__num,.peg--yellow .peg__num{color:#2d2008e0;text-shadow:0 1px 1px rgba(255,255,255,.45)}.peg--red{--c-light: #ef7060;--c: #d63b2f;--c-dark: #7c1b12}.peg--orange{--c-light: #f5a55a;--c: #e8842c;--c-dark: #8f4a0d}.peg--yellow{--c-light: #f7dd75;--c: #eec437;--c-dark: #97740e}.peg--green{--c-light: #6fbe74;--c: #3f9d44;--c-dark: #1c5420}.peg--blue{--c-light: #6d9be2;--c: #2f6fd0;--c-dark: #163a75}.peg--purple{--c-light: #b177cd;--c: #8e44ad;--c-dark: #4d2160}.peg--teal{--c-light: #62c9c1;--c: #1fa8a0;--c-dark: #0c5a55}.peg--pink{--c-light: #f39cc3;--c: #e2649a;--c-dark: #8f2f5c}.peg--white{--c-light: #ffffff;--c: #f0ebdd;--c-dark: #a99f87}.peg--black{--c-light: #707070;--c: #303030;--c-dark: #000000}@keyframes peg-pop{0%{transform:scale(.4);opacity:.4}to{transform:scale(1);opacity:1}}.feedback{display:grid;grid-template-columns:repeat(2,var(--fb));grid-auto-rows:var(--fb);gap:clamp(.18rem,.5dvh,.28rem);padding:clamp(.2rem,.55dvh,.3rem);border-radius:8px;background:#2e190759;box-shadow:inset 0 1px 3px #00000073}.fb-peg{width:var(--fb);height:var(--fb);border-radius:50%;background:radial-gradient(circle at 40% 32%,#5e3d1e,#3c240e 78%);box-shadow:inset 0 2px 3px #00000080,0 1px #ffe0b21a}.fb-peg--exact{background:radial-gradient(circle at 32% 28%,#ffffffa6,#fff0 35%),radial-gradient(circle at 50% 45%,#4a4a4a,#191919 65%,#000);box-shadow:0 1px 2px #0009}.fb-peg--partial{background:radial-gradient(circle at 32% 28%,#fffffff2,#fff0 40%),radial-gradient(circle at 50% 45%,#fffdf6,#ece1c8 65%,#b8a888);box-shadow:0 1px 2px #0000008c}.tray{margin-top:clamp(.4rem,1.1dvh,.9rem);display:flex;flex-direction:column;gap:clamp(.35rem,.9dvh,.7rem);border-radius:14px;padding:clamp(.4rem,1dvh,.75rem) .8rem;background:repeating-linear-gradient(88deg,#5a34141a,#5a341400 9px,#ffdaaa0a 14px,#5a341417 22px),linear-gradient(180deg,#6d4520,#5a3717);border:2px solid #47290f;box-shadow:inset 0 2px 3px #ffe2b438,inset 0 -3px 5px #1e0f0380,0 6px 16px #00000073}.palette{display:flex;flex-wrap:wrap;justify-content:center;gap:.5rem}.palette__slot{border-radius:50%;padding:.22rem;background:radial-gradient(circle at 40% 32%,#3a2410,#241304 75%);box-shadow:inset 0 2px 4px #000000bf,0 1px #ffe0b224;transition:opacity .15s ease}.palette__slot--used{opacity:.32}.controls{display:flex;justify-content:center;gap:.6rem}.btn{border-radius:10px;padding:clamp(.3rem,.9dvh,.5rem) 1.3rem;font-size:.95rem;font-weight:700;letter-spacing:.05em;transition:transform .08s ease,filter .12s ease}.btn:not(:disabled):active{transform:translateY(1px) scale(.98)}.btn:disabled{opacity:.45;filter:saturate(.5)}.btn--brass{color:#3a260e;background:linear-gradient(180deg,#ecca80,#cd9f4f 55%,#ab7d34);border:1px solid #7a5a26;box-shadow:0 2px 6px #00000073,inset 0 1px #ffffff8c,inset 0 -2px 3px #5a3c0f66;text-shadow:0 1px 0 rgba(255,240,210,.5);min-width:8.5rem}.btn--attention{animation:btn-glow 1.2s ease-in-out infinite}@keyframes btn-glow{0%,to{filter:drop-shadow(0 0 2px rgba(255,222,145,.35))}50%{filter:drop-shadow(0 0 10px rgba(255,222,145,.95))}}.btn--ghost{color:#d8b578;background:linear-gradient(180deg,#78502666,#50321466);border:1px solid rgba(160,115,60,.55);box-shadow:inset 0 1px #ffe0b226,0 1px 3px #00000059;padding:clamp(.3rem,.9dvh,.45rem) .95rem}.legend{margin-top:clamp(.35rem,1dvh,.8rem);text-align:center;font-family:var(--font-secondary);font-size:.8rem;color:#a89272;display:flex;align-items:center;justify-content:center;gap:.4rem}.legend__peg{display:inline-block;width:.7rem;height:.7rem}.legend__sep{padding:0 .3rem;color:#7a684e}@media(max-height:600px){.legend{display:none}}.overlay{position:fixed;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;padding:1.5rem;background:#0c08049e;backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);animation:overlay-in .25s ease-out;z-index:10}.banner{position:relative;width:min(20rem,100%);text-align:center;border-radius:16px;padding:1.5rem 1.4rem 1.4rem;background:repeating-linear-gradient(92deg,#5a34141a,#5a341400 8px,#ffdaaa0d 13px,#5a341417 20px),linear-gradient(160deg,#9c6636,#7e4f24);border:3px solid #5b3a1a;box-shadow:inset 0 2px 3px #ffe2b44d,inset 0 -3px 6px #23120580,0 18px 40px #0009;animation:banner-in .28s cubic-bezier(.2,.9,.3,1.2)}.banner__close{position:absolute;top:.45rem;right:.55rem;width:1.9rem;height:1.9rem;border-radius:50%;border:1px solid rgba(160,115,60,.55);background:linear-gradient(180deg,#78502673,#50321473);color:#e8d3a4;font-size:1.15rem;line-height:1;display:flex;align-items:center;justify-content:center;box-shadow:inset 0 1px #ffe0b22e,0 1px 3px #0006}.banner__close:active{transform:scale(.94)}.banner__title{font-variant:small-caps;letter-spacing:.08em;font-size:1.35rem;color:#f4dda9;text-shadow:0 2px 3px rgba(0,0,0,.5)}.banner__text{margin:.5rem 0 .9rem;font-family:var(--font-secondary);font-size:.95rem;color:#efe0c4}.banner__secret{display:flex;flex-wrap:wrap;justify-content:center;gap:.5rem;margin-bottom:1.1rem;padding:.55rem;border-radius:10px;background:#28160673;box-shadow:inset 0 2px 4px #00000080}.config__fields{margin:1rem 0 .2rem;display:flex;flex-direction:column;gap:.8rem}.config-field{display:flex;align-items:center;justify-content:space-between;gap:1rem}.config-field__label{font-variant:small-caps;letter-spacing:.1em;font-size:1rem;color:#f0dcae}.stepper{display:flex;align-items:center;gap:.55rem}.stepper__btn{min-width:2.3rem;padding:.3rem 0;font-size:1.15rem;line-height:1}.stepper__value{min-width:2rem;text-align:center;font-size:1.15rem;font-weight:700;color:#f4dda9;text-shadow:0 1px 2px rgba(0,0,0,.5)}.config__colors{display:flex;flex-wrap:wrap;justify-content:center;gap:.3rem;padding:.15rem 0 .1rem}.config__reset{margin-bottom:.7rem}.config__note{margin:.7rem 0 1rem;font-family:var(--font-secondary);font-size:.82rem;color:#d9c6a2}.toggle{position:relative;width:3rem;height:1.55rem;border-radius:1rem;border:1px solid #3c240c;background:radial-gradient(circle at 40% 32%,#3a2410,#241304 80%);box-shadow:inset 0 2px 4px #000000bf,0 1px #ffe0b224;transition:background .2s ease;padding:0}.toggle__knob{position:absolute;top:50%;left:.15rem;transform:translateY(-50%);width:1.2rem;height:1.2rem;border-radius:50%;background:linear-gradient(180deg,#ecca80,#cd9f4f 55%,#ab7d34);border:1px solid #7a5a26;box-shadow:0 1px 3px #00000080,inset 0 1px #ffffff80;transition:left .18s ease}.toggle--on{background:linear-gradient(180deg,#e9c46a8c,#c89a4b73);box-shadow:inset 0 1px 3px #5a370f99,0 0 8px #ffde9159}.toggle--on .toggle__knob{left:calc(100% - 1.35rem)}.toggle:disabled{opacity:.55;cursor:default}.config__actions{display:flex;justify-content:center;gap:.6rem}@keyframes overlay-in{0%{opacity:0}to{opacity:1}}@keyframes banner-in{0%{transform:translateY(18px) scale(.92);opacity:0}to{transform:translateY(0) scale(1);opacity:1}}@media(max-width:400px){.app{--overhead: calc(6.2rem + var(--fb-cols) * 1.1rem);padding-left:.55rem;padding-right:.55rem}.board{padding-left:.55rem;padding-right:.55rem}.row{gap:.45rem}.palette{gap:.4rem}}