:root{--color-1:#C8C7C5;--color-2:#E1AE7E;--color-3:#B62222;--color-4:#FEE2B8;--color-5:#807F7D;color-scheme:light;font-family:Arial,sans-serif;background:var(--color-4);color:#292725}*{box-sizing:border-box}body{margin:0}header,main,footer{max-width:1200px;margin:auto;padding:28px}header{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--color-5)}.brand{font-size:32px;font-weight:800;letter-spacing:-1.5px;text-decoration:none;color:#292725}.brand span{color:var(--color-3)}h1{font-size:clamp(32px,5vw,54px);letter-spacing:-2px;margin-bottom:10px}p{line-height:1.6}small,.hint,footer{color:#534f4b}.hint{font-size:12px}.layout{display:grid;grid-template-columns:340px 1fr;gap:24px;margin-top:32px}section{background:var(--color-1);padding:24px;border:1px solid var(--color-5);border-radius:18px;margin-bottom:24px}h2{font-size:18px;margin:0 0 20px}label{display:block;font-size:13px;margin:18px 0 8px}input,select,button{font:inherit}input[type=text],select{display:block;width:100%;padding:11px;margin-top:8px;background:var(--color-4);color:#292725;border:1px solid var(--color-5);border-radius:9px}input[type=range]{display:block;width:100%;margin-top:12px;accent-color:var(--color-3)}input[type=checkbox]{accent-color:var(--color-3)}input[type=color]{display:block;width:100%;height:36px;margin-top:8px;border:0;background:transparent}input[type=file]{display:block;max-width:100%;margin:12px auto 0;font-size:12px}.drop{padding:24px 12px;text-align:center;border:1px dashed var(--color-3);border-radius:12px;background:var(--color-4);cursor:pointer;font-weight:600}button{border:0;border-radius:9px;padding:12px 15px;background:var(--color-3);color:var(--color-4);cursor:pointer;font-weight:600}button:hover{background:var(--color-2);color:#292725}button:disabled{opacity:.45;cursor:default}.secondary{background:var(--color-4);color:#292725;border:1px solid var(--color-5)}.row{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}.row label{margin-top:10px}.stage{display:grid;place-items:center;min-height:320px;padding:12px;background:#807F7D;border-radius:12px;margin:20px 0;color:#fff;text-align:center}canvas{display:block;max-width:100%;max-height:70vh;touch-action:none;cursor:crosshair}.thumbs{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}.thumbs button{padding:4px;background:var(--color-4);border:2px solid transparent}.thumbs button[aria-pressed=true]{border-color:var(--color-3)}.thumbs img{display:block;width:54px;height:54px;object-fit:contain}details{margin:16px 0}summary{cursor:pointer}#symbols button{padding:6px;margin:3px;background:var(--color-4);color:#292725}#symbols h3{font-size:12px}footer{text-align:center;font-size:12px}[hidden]{display:none!important}:focus-visible{outline:3px solid var(--color-3);outline-offset:3px}@media(max-width:760px){.layout{grid-template-columns:1fr}header,main{padding:18px}section{padding:18px}.stage{min-height:240px}header small{font-size:11px}}