/* CONFIG skill — themes + gear window. Pages use the --c-* tokens. */
:root,[data-theme="ocean"]{--c-bg:#06243f;--c-surface:#0b3558;--c-text:#e6f4ff;--c-muted:#8fb8d8;--c-accent:#2ec5ff;--c-border:#1d5580}
[data-theme="midnight"]{--c-bg:#0d1117;--c-surface:#161b22;--c-text:#e6edf3;--c-muted:#8b949e;--c-accent:#58a6ff;--c-border:#30363d}
[data-theme="graphite"]{--c-bg:#1c1c1e;--c-surface:#2c2c2e;--c-text:#f2f2f7;--c-muted:#a1a1a6;--c-accent:#ff9f0a;--c-border:#3a3a3c}
[data-theme="forest"]{--c-bg:#0f1f17;--c-surface:#173326;--c-text:#e3f5ea;--c-muted:#8fb9a0;--c-accent:#4ade80;--c-border:#24503a}
[data-theme="plum"]{--c-bg:#1a1022;--c-surface:#2a1a36;--c-text:#f3e8ff;--c-muted:#b39cc7;--c-accent:#c084fc;--c-border:#43295a}
[data-theme="paper"]{--c-bg:#ffffff;--c-surface:#f5f6f8;--c-text:#1f2328;--c-muted:#59636e;--c-accent:#0969da;--c-border:#d1d9e0}
[data-theme="sand"]{--c-bg:#fbf7f0;--c-surface:#f1e9da;--c-text:#3b2f20;--c-muted:#7a6a55;--c-accent:#b45309;--c-border:#dccdb3}
[data-theme="mint"]{--c-bg:#f3fbf7;--c-surface:#e2f4ea;--c-text:#13321f;--c-muted:#4f705c;--c-accent:#047857;--c-border:#b9dfc8}
[data-theme="rose"]{--c-bg:#fff7f8;--c-surface:#fde8ec;--c-text:#3a1820;--c-muted:#80525d;--c-accent:#be123c;--c-border:#f3c3cd}

/* Gradient (degradê) themes: --c-grad is painted on <html>; surfaces stay solid for legibility */
[data-theme="aurora"]{--c-bg:#0a1f2e;--c-surface:#10303f;--c-text:#e8fbff;--c-muted:#92c4cf;--c-accent:#2dd4bf;--c-border:#1f5565;--c-grad:linear-gradient(135deg,#041a2b 0%,#0b4a5a 50%,#2b2a72 100%)}
[data-theme="ember"]{--c-bg:#2a0f14;--c-surface:#3b161d;--c-text:#fff0ea;--c-muted:#d0a39a;--c-accent:#ff7a3d;--c-border:#6a2a30;--c-grad:linear-gradient(135deg,#1c0a12 0%,#5a1626 50%,#8a3a12 100%)}
[data-theme="nebula"]{--c-bg:#150f33;--c-surface:#21184a;--c-text:#f0ecff;--c-muted:#aaa0d6;--c-accent:#a78bfa;--c-border:#3b2f7a;--c-grad:linear-gradient(135deg,#0c0a26 0%,#3a1a73 50%,#1b4a9a 100%)}
[data-theme="jade"]{--c-bg:#07241c;--c-surface:#0e3629;--c-text:#e6fff4;--c-muted:#8fcfb2;--c-accent:#34d399;--c-border:#1b5a44;--c-grad:linear-gradient(135deg,#04150f 0%,#0b4a37 50%,#0e5a66 100%)}
[data-theme="sunrise"]{--c-bg:#fff1e8;--c-surface:#fffaf6;--c-text:#3a1f14;--c-muted:#82594a;--c-accent:#d9480f;--c-border:#f2c9b3;--c-grad:linear-gradient(135deg,#ffe8d2 0%,#ffd1d9 55%,#fbc8ee 100%)}
[data-theme="skyline"]{--c-bg:#eaf4ff;--c-surface:#f8fbff;--c-text:#12263f;--c-muted:#52688a;--c-accent:#1d6fe0;--c-border:#bcd4f2;--c-grad:linear-gradient(135deg,#d8ecff 0%,#e3e3ff 55%,#f1dcff 100%)}
[data-theme="meadow"]{--c-bg:#f1fbe9;--c-surface:#fafef6;--c-text:#1c3016;--c-muted:#5a7550;--c-accent:#3f8f12;--c-border:#c9e3b5;--c-grad:linear-gradient(135deg,#dcf7d6 0%,#eef8c9 55%,#fdf2c4 100%)}
[data-theme="lilac"]{--c-bg:#f6efff;--c-surface:#fcf9ff;--c-text:#2c1a45;--c-muted:#6f5a8c;--c-accent:#7c3aed;--c-border:#dac8f2;--c-grad:linear-gradient(135deg,#eadcff 0%,#dbe5ff 55%,#ffe0f2 100%)}

/* Custom: tokens are computed by config.js from the 2 user colors (inline on <html>); these are the pre-JS defaults */
[data-theme="custom"]{--c-bg:#2b5876;--c-surface:#1a3547;--c-text:#f5f8fc;--c-muted:#b9c6d6;--c-accent:#7ec4ee;--c-border:#3b5a73;--c-grad:linear-gradient(135deg,#2b5876,#4e4376)}

html{background:var(--c-bg);background-image:var(--c-grad,none);background-attachment:fixed;background-repeat:no-repeat;background-size:cover;min-height:100%;color:var(--c-text);color-scheme:dark}
html[data-theme="paper"],html[data-theme="sand"],html[data-theme="mint"],html[data-theme="rose"],
html[data-theme="sunrise"],html[data-theme="skyline"],html[data-theme="meadow"],html[data-theme="lilac"]{color-scheme:light}
body{background:transparent;color:var(--c-text)}

/* Background image layer (any theme): fixed, behind the page, dissolved by opacity. Set by config.js */
html::before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;background-repeat:no-repeat;background-position:center;opacity:0;transition:opacity .25s}
html[data-bgimg]::before{background-image:var(--cfg-img);opacity:var(--cfg-img-o,.4)}
html[data-bgimg="cover"]::before{background-size:cover}
html[data-bgimg="wm"]::before{background-size:contain;inset:10%}

#cfg-gear{box-sizing:border-box;position:fixed;top:12px;right:12px;z-index:10000;width:40px;height:40px;border-radius:50%;
  border:1px solid var(--c-border);background:var(--c-surface);color:var(--c-text);cursor:pointer;
  display:grid;place-items:center;padding:0;transition:transform .3s}
#cfg-gear:hover{transform:rotate(60deg)}
#cfg-gear:focus-visible,#cfg-win button:focus-visible{outline:2px solid var(--c-accent);outline-offset:2px}
#cfg-gear svg{width:22px;height:22px}

#cfg-back{position:fixed;inset:0;z-index:10001;background:rgba(0,0,0,.45);display:none}
#cfg-back.open{display:block}
#cfg-win{box-sizing:border-box;position:fixed;top:60px;right:12px;width:min(360px,calc(100vw - 24px));max-height:calc(100vh - 80px);
  overflow:auto;background:var(--c-surface);color:var(--c-text);border:1px solid var(--c-border);
  border-radius:14px;padding:16px;box-shadow:0 12px 40px rgba(0,0,0,.35);font:14px/1.4 system-ui,sans-serif}
#cfg-win header{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}
#cfg-win h2{font-size:16px;margin:0}
#cfg-win h3{font-size:12px;text-transform:uppercase;letter-spacing:.06em;color:var(--c-muted);margin:14px 0 8px}
#cfg-win button{font:inherit;color:inherit;cursor:pointer}
#cfg-close{background:none;border:0;font-size:22px;line-height:1;padding:2px 6px}
.cfg-themes{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.cfg-theme{box-sizing:border-box;min-width:0;border:2px solid var(--c-border);border-radius:10px;padding:6px;background:var(--c-bg);text-align:left}
.cfg-theme .sw{display:flex;height:22px;border-radius:6px;overflow:hidden;margin-bottom:4px}
.cfg-theme .sw i{flex:1}
.cfg-theme .sw i.g{flex:3}
.cfg-theme .sw i.a{flex:1}
.cfg-theme small{font-size:11px}
.cfg-langs{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}
.cfg-lang{border:1px solid var(--c-border);border-radius:8px;padding:7px 0;background:var(--c-bg);font-weight:600}
.cfg-theme[aria-pressed="true"],.cfg-lang[aria-pressed="true"]{border-color:var(--c-accent);box-shadow:0 0 0 1px var(--c-accent)}
#cfg-win h3 label{font:inherit;text-transform:inherit;letter-spacing:inherit;color:inherit}
.cfg-titlebox{display:flex;gap:6px}
#cfg-title-input{box-sizing:border-box;flex:1;min-width:0;font:inherit;color:var(--c-text);background:var(--c-bg);
  border:1px solid var(--c-border);border-radius:8px;padding:7px 9px}
#cfg-title-input:focus-visible{outline:2px solid var(--c-accent);outline-offset:1px}
#cfg-title-reset{border:1px solid var(--c-border);border-radius:8px;padding:7px 10px;background:var(--c-bg)}
#cfg-title-reset:disabled{opacity:.45;cursor:default}

.cfg-custom{display:grid;gap:10px}
.cfg-cc{display:flex;align-items:flex-end;justify-content:space-between;gap:8px}
.cfg-cc label{flex:1}
.cfg-cc label,.cfg-ang{display:flex;flex-direction:column;gap:4px;font-size:12px;color:var(--c-muted);min-width:0}
.cfg-cc input[type=color]{box-sizing:border-box;width:100%;min-width:64px;height:36px;padding:2px;cursor:pointer;
  background:var(--c-bg);border:1px solid var(--c-border);border-radius:8px}
#cfg-swap{box-sizing:border-box;flex:none;width:36px;height:36px;border:1px solid var(--c-border);border-radius:8px;background:var(--c-bg);font-size:16px;line-height:1}
#cfg-prev{height:28px;border-radius:8px;border:1px solid var(--c-border)}
.cfg-ang{flex-direction:row;align-items:center;gap:8px}
.cfg-ang input[type=range]{flex:1;min-width:0;accent-color:var(--c-accent)}
.cfg-ang output{min-width:38px;text-align:right;color:var(--c-text);font-variant-numeric:tabular-nums}
#cfg-win input[type=color]:focus-visible,#cfg-win input[type=range]:focus-visible{outline:2px solid var(--c-accent);outline-offset:2px}

.cfg-img{display:grid;gap:10px}
.cfg-imgrow{display:flex;align-items:center;gap:8px}
#cfg-thumb{flex:none;width:36px;height:36px;border-radius:8px;border:1px solid var(--c-border);background:var(--c-bg) center/cover no-repeat}
#cfg-pick,#cfg-imgclear{border:1px solid var(--c-border);border-radius:8px;padding:8px 10px;background:var(--c-bg)}
#cfg-pick{flex:1;min-width:0}
#cfg-imgclear:disabled{opacity:.45;cursor:default}
.cfg-chk{display:flex;align-items:center;gap:8px;cursor:pointer}
.cfg-chk input{width:16px;height:16px;accent-color:var(--c-accent)}
#cfg-win input:disabled{opacity:.45}

/* TODO / HISTORY memo */
#cfg-todo{margin-top:6px}
.cfg-ttool{display:flex;gap:6px;flex-wrap:wrap;margin-top:14px}
.cfg-ttool button,#cfg-tadd{border:1px solid var(--c-border);border-radius:8px;padding:6px 10px;background:var(--c-bg)}
.cfg-ttool button:disabled{opacity:.45;cursor:default}
.cfg-tadd{display:flex;gap:6px}
#cfg-tin{box-sizing:border-box;flex:1;min-width:0;font:inherit;color:var(--c-text);background:var(--c-bg);border:1px solid var(--c-border);border-radius:8px;padding:7px 9px}
#cfg-tin:focus-visible{outline:2px solid var(--c-accent);outline-offset:1px}
.cfg-tl{list-style:none;margin:8px 0 0;padding:0;max-height:150px;overflow:auto;display:grid;gap:4px}
.cfg-task{display:flex;align-items:flex-start;gap:4px;padding:5px 6px;border:1px solid var(--c-border);border-radius:8px;background:var(--c-bg);cursor:pointer;-webkit-user-select:none;user-select:none}
.cfg-task.sel{border-color:var(--c-accent);box-shadow:0 0 0 1px var(--c-accent)}
.cfg-task .tt{flex:1;min-width:0;overflow-wrap:anywhere;font-size:13px}
.cfg-task time{color:var(--c-muted);font-variant-numeric:tabular-nums}
.cfg-task.done .tx{text-decoration:line-through;opacity:.75}
.cfg-task button{flex:none;border:0;background:none;padding:0 6px;font-size:16px;line-height:1.3}
.cfg-task.empty{color:var(--c-muted);font-size:12px;border-style:dashed;cursor:default}