*{box-sizing:border-box;margin:0;padding:0}:root{color-scheme:light}html,body,#root{height:100%}body{font-family:Inter,system-ui,-apple-system,Segoe UI,sans-serif;background:#f3efe8;color:#2a2622;overflow:hidden}.app{position:fixed;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column}.topbar{position:absolute;top:0;left:0;right:0;z-index:10;display:flex;align-items:center;justify-content:space-between;padding:18px 26px;pointer-events:none}.brand{display:flex;flex-direction:column;pointer-events:auto}.brand-mark{font-weight:800;letter-spacing:.22em;font-size:18px;color:#3a2c1c}.brand-sub{font-size:12px;letter-spacing:.04em;color:#8a7c6a;margin-top:2px}.tabs{display:flex;gap:6px;background:#ffffffb3;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);padding:5px;border-radius:12px;pointer-events:auto;box-shadow:0 4px 18px #503c1e1f}.tab{border:0;background:transparent;padding:8px 18px;border-radius:8px;font-size:14px;font-weight:600;color:#6f6152;cursor:pointer;transition:.15s}.tab:hover{color:#3a2c1c}.tab.active{background:#3a2c1c;color:#fff}canvas{display:block;flex:1;touch-action:none}.dock{position:absolute;bottom:0;left:0;right:0;z-index:10;padding:16px 22px 22px;background:linear-gradient(to top,#f3efe8f5 55%,#f3efe800)}.dock-info{display:flex;align-items:baseline;gap:16px;margin-bottom:12px;flex-wrap:wrap}.target{font-size:14px;color:#4a3f30}.target strong{color:#3a2c1c}.hint{font-size:12.5px;color:#9a8b78;display:flex;align-items:center;gap:10px}.clear{border:0;background:#eadfce;color:#6b573c;font-size:12px;font-weight:600;padding:4px 10px;border-radius:999px;cursor:pointer}.clear:hover{background:#e0d1b8}.palette{display:flex;gap:10px;overflow-x:auto;padding-bottom:4px}.swatch{display:flex;align-items:center;gap:9px;flex:0 0 auto;border:2px solid transparent;background:#ffffffd9;padding:7px 14px 7px 8px;border-radius:12px;cursor:pointer;box-shadow:0 3px 12px #503c1e1a;transition:.15s}.swatch:hover{transform:translateY(-2px)}.swatch.active{border-color:#c98a2e;box-shadow:0 6px 18px #c98a2e47}.chip{width:32px;height:32px;border-radius:7px;background-size:cover;background-position:center;box-shadow:inset 0 0 0 1px #00000026}.label{font-size:13px;font-weight:600;color:#4a3f30;white-space:nowrap}@media (max-width: 640px){.brand-sub{display:none}.tab{padding:8px 13px}.label{display:none}.swatch{padding:7px}}