:root{--bg:#101114;--bg-alt:#1b1d22;--text:#f5f3d7;--accent:#ffd83b;--accent-glow:#ffea86;--danger:#ff5555;--ok:#4caf50;--font-stack:"Courier New",Consolas,monospace;--root-font-scale:100%;--hue:210;--bg-hue:210;--tx-hue:50}*{box-sizing:border-box}body{background:var(--bg);color:var(--text);font-family:var(--font-stack);margin:0;line-height:1.4}:focus-visible{outline:2px solid var(--accent);outline-offset:2px}button{cursor:pointer;background:#222530;color:var(--accent);border:1px solid var(--accent);padding:.5rem .9rem;border-radius:4px;font-family:inherit;transition:.15s}button:hover{background:#2d313f;box-shadow:0 0 6px var(--accent-glow)}button:active{transform:scale(.97)}button[disabled]{opacity:.4;cursor:not-allowed}textarea{width:100%;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;background:#0f141c;color:var(--text);border:1px solid #2a3747;border-radius:12px;padding:12px 44px 12px 12px}*::-webkit-scrollbar{width:8px;height:8px}*::-webkit-scrollbar-track{background:transparent}*::-webkit-scrollbar-thumb{background-color:hsl(var(--tx-hue) 65% 72% / .35);border-radius:6px}*::-webkit-scrollbar-thumb:hover{background-color:hsl(var(--tx-hue) 70% 70% / .5)}*::-webkit-scrollbar-thumb:active{background-color:hsl(var(--tx-hue) 75% 66% / .7)}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);border:0}.input-section .input-container textarea,.output-section .output-container textarea{resize:none;overflow-y:hidden;transition:height .08s ease;min-height:140px}.input-section label,.output-section label{display:block;margin:8px 0 6px;opacity:.85}.output-section{margin-top:16px}.copy-btn{background:#1f2732;border:1px solid #2a3747;color:#d7e6f7;border-radius:8px;cursor:pointer}.copy-btn:hover{background:#253141}.controls{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:10px 0}.controls button{padding:6px 10px}.controls select{height:24px}.history-shell{background:#161c25;border:1px solid #2b3542;border-radius:16px}.lessons-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(70px,1fr));gap:6px;margin-top:10px}.lesson-card{background:#1b232c;border:1px solid #2e3a48;border-radius:10px;padding:6px 4px 8px;text-align:center;font-size:.7rem;cursor:pointer;transition:.15s;position:relative}.lesson-card:hover{background:#232e3a;border-color:#3d4b5b;box-shadow:0 0 6px #ffd83b40}.lesson-card strong{display:block;font-size:.8rem;color:#9ee493}.lesson-card code{color:#ffd83b;font-weight:600}.footer-fun{margin:36px 0 18px;opacity:.85;text-align:center;color:var(--text)}.footer-fun .em{color:var(--accent)}.ad-bar{display:grid;grid-template-columns:1fr auto 1fr;gap:12px;margin:8px 0}.ad-slot{background:#121821;border:1px dashed #2b3542;border-radius:10px}.ad-left,.ad-right{min-height:600px}.ad-bottom{position:fixed;left:16px;right:16px;bottom:16px;min-height:90px;z-index:10}@media (max-width: 1024px){.ad-left,.ad-right{display:none}.ad-bottom{min-height:60px;left:8px;right:8px;bottom:8px}}@media (min-width: 1440px){.ad-left,.ad-right{min-width:300px}}.hue-chip{display:flex;align-items:center;gap:8px;background:#141c24;border:1px solid #273447;color:var(--text);border-radius:999px;padding:6px 10px;cursor:pointer}.hue-chip:hover{background:#182231}.hue-chip .swatch{width:18px;height:18px;border-radius:50%;position:relative;display:inline-block;background:conic-gradient(from 0deg,hsl(var(--bg-hue) 45% 70%) 0,hsl(var(--bg-hue) 45% 70%) 75%,hsl(var(--bg-hue) 45% 70%) 75%)}.hue-chip .swatch:before{content:"";position:absolute;top:4px;right:4px;bottom:4px;left:4px;border-radius:50%;background:hsl(var(--tx-hue) 65% 65%)}.font-rail{position:fixed;top:6px;right:8px;display:flex;flex-direction:row;align-items:flex-end;gap:4px;padding:4px 8px 6px;background:#00000073;border:1px solid #2d3642;border-radius:12px;z-index:1000;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.font-rail button{background:transparent;color:var(--accent);border:1px solid #3a4552;border-radius:6px;min-width:38px;height:42px;display:flex;align-items:center;justify-content:center;font-weight:700;cursor:pointer;transition:background .15s,border-color .15s,box-shadow .15s,transform .15s}.font-rail button[data-active="1"]{border-color:var(--accent);box-shadow:0 0 0 2px #ffd83b59,0 0 8px var(--accent-glow);background:#ffd83b12}.font-rail button:focus-visible{outline:none;border-color:var(--accent-glow);box-shadow:0 0 0 3px #ffd83b8c}.font-rail button:hover{background:#ffd83b1a}.font-rail button:active{transform:scale(.95)}@media (max-width:500px){.hue-popover{left:auto;right:0}}