*{box-sizing:border-box}:root{--bg: #eee;--text: #333;--panel: #fafafa;--border: #bbb;--btn-bg: #007bff;--btn-text: #fff;--slot-border: #999;--status-win: #0a0;--status-lose: #d00}body.dark{--bg: #201d1d;--text: #e4e4e4;--panel: #1e1e1e;--border: #444;--btn-bg: #1e88e5;--btn-text: #fff;--slot-border: #555;--status-win: #4caf50;--status-lose: #ef5350}body{font-family:Arial,sans-serif;margin:0;padding:10px;background:var(--bg);color:var(--text);overflow-x:hidden;transition:background .25s,color .25s}.theme-toggle{position:fixed;top:8px;right:8px;width:44px;height:44px;display:flex;align-items:center;justify-content:center;font-size:22px;background:var(--panel);color:var(--text);border:1px solid var(--border);border-radius:50%;cursor:pointer;padding:0;margin:0;box-shadow:0 2px 6px #00000040;transition:background .25s,color .25s,transform .15s;z-index:1000}.theme-toggle:hover{transform:scale(1.06)}.theme-toggle:active{transform:scale(.95)}.theme-toggle:focus{outline:2px solid var(--btn-bg);outline-offset:2px}.user-info{text-align:center;font-weight:700;margin-bottom:15px;color:var(--text);background:var(--panel);border:1px solid var(--border);border-radius:6px;padding:8px 12px;max-width:400px;margin-left:auto;margin-right:auto}.user-info button{margin-left:10px;font-size:12px;padding:4px 8px}.user-info label{display:block;margin-bottom:5px}.user-info input{margin-left:5px;margin-right:10px;padding:4px 8px}.settings{text-align:center;font-weight:700;margin-bottom:20px}.legend{text-align:center;font-size:14px;margin:-10px 0 15px;color:#444;line-height:1.3;padding:0 8px}.legend-item{white-space:nowrap}.board{display:flex;flex-direction:column;gap:10px;margin-bottom:20px}.row{display:flex;align-items:center;gap:10px}.peg{width:40px;height:40px;border-radius:50%;border:1px solid #000}.slot{width:44px;height:44px;border:2px dashed var(--slot-border);border-radius:4px;display:flex;align-items:center;justify-content:center;cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent}.slot .peg{width:30px;height:30px}.feedback{font-size:14px;font-weight:700;margin-left:20px}.status{text-align:center;font-size:18px;font-weight:700;color:var(--status-lose)}.status.status-won{color:var(--status-win)}.status.status-lost{color:var(--status-lose)}.palette{display:flex;justify-content:center;gap:10px;margin-bottom:20px;flex-wrap:wrap}.secret-section{margin:10px auto 5px;padding:8px 10px;border:1px solid var(--border);border-radius:6px;background:var(--panel);max-width:360px;text-align:center;font-size:13px}.secret-label{font-weight:600;margin-bottom:4px}.secret-pegs{display:flex;justify-content:center;gap:6px;margin-bottom:6px}.secret-pegs .peg{width:32px;height:32px}.secret-text{font-style:italic;line-height:1.3}.leaderboard-container{margin:14px auto;max-width:500px}.lb{background:var(--panel);border:1px solid var(--border);border-radius:8px;padding:10px 12px}.lb h3{margin:4px 0 8px;font-size:18px;text-align:center}.lb-form{display:flex;gap:6px;margin-bottom:8px}.lb-form input{flex:1;padding:6px 8px;border:1px solid var(--border);border-radius:4px;background:var(--bg);color:var(--text)}.lb-form button{padding:6px 12px}.lb-table{width:100%;border-collapse:collapse;font-size:13px}.lb-table th,.lb-table td{padding:4px 6px;text-align:left;border-bottom:1px solid var(--border)}.lb-table th{font-weight:600}.lb-table tbody tr:nth-child(2n){background:#0000000a}body.dark .lb-table tbody tr:nth-child(2n){background:#ffffff0d}.lb-pages{margin-top:8px;display:flex;gap:10px;justify-content:center;align-items:center;font-size:12px}.lb-pages button{padding:4px 10px}.lb .username{text-align:center;margin-bottom:8px;color:var(--text)}.lb{padding:14px 16px}.lb-form input:focus{outline:none;box-shadow:none;border-color:var(--btn-bg)}.user-info{margin:10px auto 14px;text-align:center;font-size:14px;cursor:pointer;width:fit-content}.user-info:not(.editing):not(.new){padding:0;border:none;background:none;border-radius:0}.user-info.editing,.user-info.new{cursor:default;display:flex;gap:8px;align-items:center;padding:6px 10px;border:1px solid var(--border);border-radius:6px;background:var(--panel)}.user-info input{background:transparent;border:1px solid var(--border);padding:4px 6px;border-radius:4px;color:var(--text)}.user-info input:focus{outline:none;border-color:var(--btn-bg)}.user-info button.secondary{background:#555}.color-btn{width:50px;height:50px;border:none;border-radius:8px;cursor:pointer}button{padding:10px 20px;background:var(--btn-bg);color:var(--btn-text);border:none;border-radius:4px;cursor:pointer;margin:0 5px;transition:background .25s,color .25s;touch-action:manipulation;-webkit-tap-highlight-color:transparent}button.icon-btn{width:46px;height:46px;padding:0;display:inline-flex;align-items:center;justify-content:center;margin:0 5px}button.icon-btn svg{width:26px;height:26px;pointer-events:none}body.dark button.icon-btn{background:var(--panel)}button.icon-btn:hover{filter:brightness(1.1)}.settings-buttons .icon-btn{width:44px;height:44px}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}button:disabled{background:#ccc;cursor:not-allowed}.howto{margin:25px auto 40px;max-width:640px;font-size:14px;line-height:1.4}.howto details{border:1px solid var(--border);border-radius:6px;background:var(--panel);padding:6px 10px}.howto summary{cursor:pointer;font-weight:600;list-style:none}.howto summary::-webkit-details-marker{display:none}.howto summary:after{content:" ▼";font-size:11px}.howto details[open] summary:after{content:" ▲"}.howto-body{margin-top:6px}.howto ol{margin:6px 0 10px 20px;padding:0}.howto p{margin:6px 0}@media (max-width: 480px){.settings{font-size:14px}.theme-toggle{width:40px;height:40px;font-size:20px;top:6px;right:6px}.legend{font-size:12px;margin-top:-4px}.peg{width:34px;height:34px}.slot{width:38px;height:38px}.slot .peg{width:26px;height:26px}.palette{gap:6px;padding:0 4px}.color-btn{width:42px;height:42px}.palette .peg{width:34px;touch-action:manipulation;-webkit-tap-highlight-color:transparent;height:34px}button{padding:8px 14px;font-size:14px}.howto{margin:18px 0 28px;font-size:13px}.secret-section{font-size:12px;padding:6px 8px}.secret-pegs .peg{width:28px;height:28px}.lb h3{font-size:16px}.lb-table{font-size:12px}}.peg-0{background:#ec4646cc}.peg-1{background:#6262eacc}.peg-2{background:#0d0}.peg-3{background:#dd0}.peg-4{background:#d0d}.peg-5{background:#0dd}.peg-6{background:#888}.peg-7{background:#000}.color-btn[data-color="0"]{background:#ec4646cc}.color-btn[data-color="1"]{background:#6262eacc}.color-btn[data-color="2"]{background:#0d0}.color-btn[data-color="3"]{background:#dd0}.color-btn[data-color="4"]{background:#d0d}.color-btn[data-color="5"]{background:#0dd}.color-btn[data-color="6"]{background:#888}.color-btn[data-color="7"]{background:#000}.letter{position:relative;top:-2px;font-weight:700;color:#000}body.dark .letter{color:#fff;background:#0000008c;padding:2px 4px 3px;border-radius:6px;line-height:1;display:inline-block;-webkit-text-stroke:0;text-shadow:0 1px 2px rgba(0,0,0,.9),0 0 2px rgba(0,0,0,.7);font-size:14px}body.dark .peg-2 .letter,body.dark .peg-3 .letter,body.dark .peg-5 .letter{color:#000;background:#ffffffbf;text-shadow:none}body.dark .peg-4 .letter{background:#0009}