:root {
  --bg:#f6f9f9; --card:#fff; --ink:#15343a; --mut:#526a70; --line:#dce7e8;
  --acc:#007b80; --brand:#03989e; --accink:#fff; --soft:#eaf7f7;
  --danger:#a62f27; --warn:#7a5900; --warn-bg:#fff8dc; --shadow:0 8px 28px #15343a0a;
  --pro-bg:#eef5ff; --pro-line:#8cb4e8; --pro-ink:#174d88;
  color-scheme:light;
}
@media (prefers-color-scheme:dark) {
  :root {--bg:#0c1b20;--card:#12282e;--ink:#ecf5f5;--mut:#a1b8bd;--line:#2c464d;--acc:#61d5d4;--accink:#102b30;--soft:#16383d;--danger:#ff9c94;--warn:#f4d27a;--warn-bg:#302c18;--shadow:0 8px 28px #0003;--pro-bg:#102b46;--pro-line:#416d9b;--pro-ink:#b7d8ff;color-scheme:dark}
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font:400 16px/1.6 system-ui,-apple-system,"Segoe UI",sans-serif;-webkit-font-smoothing:antialiased}
a{color:var(--acc);text-underline-offset:3px}
main{max-width:1100px;margin:auto;padding:30px 24px 54px}
.skip-link{position:fixed;left:12px;top:8px;z-index:20;padding:9px 12px;background:var(--ink);color:var(--card);transform:translateY(-150%);border-radius:7px}
.skip-link:focus{transform:none}
.brand{display:flex;align-items:center;gap:11px;padding-bottom:22px;margin-bottom:38px;border-bottom:1px solid var(--line)}
.brand-logo{width:36px;height:40px;flex:none}
.wordmark{font:750 25px/1 ui-rounded,"Arial Rounded MT Bold",system-ui,sans-serif;letter-spacing:-1px}
.pro-badge,.mini-pro{font:700 10px/1 system-ui,sans-serif;letter-spacing:1px;background:var(--soft);border:1px solid var(--line);color:var(--acc);padding:5px 7px;border-radius:5px}
.mini-pro{padding:3px 5px;letter-spacing:.5px}
.brand-by{margin-left:auto;font-size:12px;color:var(--mut)}
.brand-by,.footer-brand{display:inline-flex;align-items:center;gap:7px}
.axtm-logo{display:block;width:28px;height:21px;object-fit:contain;flex:none}
@media (prefers-color-scheme:dark){.axtm-logo{filter:brightness(0) invert(1)}}
h1,h2{font-family:ui-rounded,"Arial Rounded MT Bold",system-ui,sans-serif;letter-spacing:-.035em}
h1{max-width:850px;font-size:clamp(2rem,4.5vw,3.45rem);line-height:1.1;margin:0 0 18px;text-wrap:balance}
h1 span{color:var(--acc)}
h2{line-height:1.2}
.sub{color:var(--mut);max-width:720px;font-size:16px;line-height:1.7;margin:0 0 28px}
.drop{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:220px;padding:30px 20px;border:1.5px dashed #7ba6aa;border-radius:18px;background:var(--card);box-shadow:var(--shadow);cursor:pointer;text-align:center;transition:background .18s,border-color .18s,box-shadow .18s}
.drop:hover,.drop.over{background:var(--soft);border-color:var(--acc);box-shadow:0 0 0 4px var(--soft)}
.drop strong{font:700 19px/1.4 ui-rounded,system-ui,sans-serif}
.drop p{margin:5px 0 0;color:var(--mut);font-size:13px}.drop .browse{color:var(--acc);font-weight:600;text-decoration:underline;text-underline-offset:3px}.drop .formats{font-size:10px;letter-spacing:1.5px;margin-top:13px}
.upload-icon{display:grid;place-items:center;width:50px;height:50px;background:var(--soft);border:1px solid var(--line);border-radius:14px;color:var(--acc);margin-bottom:14px}.upload-icon svg{width:25px;height:25px}
.row{display:flex;flex-wrap:wrap;gap:9px;margin:14px 0 20px;align-items:center}
button,select,input,textarea{font:inherit}
button,select,input[type=text]{border:1px solid var(--line);background:var(--card);color:var(--ink);border-radius:8px;padding:10px 12px;max-width:100%}
button{font-size:13px;font-weight:600;cursor:pointer;min-height:42px;transition:border-color .15s,background .15s}
button:hover:not(:disabled),select:hover{border-color:var(--acc);background:var(--soft)}
button:disabled{cursor:not-allowed;opacity:.6}
button:focus-visible,select:focus-visible,.drop:focus-visible,textarea:focus-visible,input:focus-visible,summary:focus-visible,a:focus-visible{outline:3px solid var(--acc);outline-offset:3px}
button.pri{background:var(--acc);border-color:var(--acc);color:var(--accink)}button.pri:hover:not(:disabled){filter:brightness(.94)}
textarea{display:block;width:100%;min-height:110px;margin-top:7px;padding:13px;border:1px solid var(--line);border-radius:10px;background:var(--card);color:var(--ink);font:13px/1.6 ui-monospace,monospace;resize:vertical}
.sheet-control{display:flex;align-items:center;gap:7px;color:var(--mut);font-size:13px}
.panel{margin:12px 0;padding:15px 18px;border:1px solid var(--line);border-radius:12px;background:var(--card)}
.panel summary{cursor:pointer;font-weight:600;font-size:13px;color:var(--mut)}.panel[open]>summary{margin-bottom:14px;padding-bottom:13px;border-bottom:1px solid var(--line)}
.controls{margin:22px 0 0;box-shadow:var(--shadow)}.controls>summary{font:700 16px/1.5 ui-rounded,system-ui,sans-serif;color:var(--ink)}
.opts{display:flex;flex-wrap:wrap;gap:16px 20px;align-items:center;font-size:12px;margin-top:8px}.opts label{display:flex;align-items:center;gap:7px;max-width:100%;color:var(--mut)}.opts select{font-size:12px;padding:8px}
fieldset.mapping{margin:0 0 18px;padding:12px 14px;border:1px solid var(--line);border-radius:10px}fieldset.mapping legend{font-weight:700;font-size:13px;padding:0 6px}
.mapping-options{display:grid;grid-template-columns:minmax(170px,1fr) minmax(340px,2fr) minmax(210px,1.2fr);align-items:start;gap:14px}.mapping-options .mapping-control{display:grid;grid-template-rows:auto auto 1fr;align-items:start;gap:5px}.mapping-control>span{color:var(--ink);font-weight:650}.mapping-control select{width:100%}.mapping-control small{color:var(--mut);font-size:10px;line-height:1.4}.values-picker{min-width:0;border:1px solid var(--line);border-radius:9px;background:var(--bg)}.values-picker>summary{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:8px 10px;cursor:pointer;color:var(--ink);font-weight:650}.values-picker[open]>summary{border-bottom:1px solid var(--line)}.values-count{padding:3px 7px;border-radius:999px;background:var(--soft);color:var(--acc);font-size:10px;font-weight:750;white-space:nowrap}.values-table{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;padding:10px}.value-row{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:6px;padding:8px;border:1px solid var(--line);border-radius:7px;background:var(--card)}.value-row .mapping-control{min-width:0}.remove-value{min-height:34px;padding:6px 8px;font-size:10px}.values-actions{padding:0 10px}.values-actions button{min-height:36px;padding:7px 10px}.values-picker .hint{margin:7px 10px 10px}.mapping-explanation{margin:14px 0 0;padding:10px 12px;border-left:3px solid var(--acc);background:var(--soft);color:var(--ink);font-size:12px;line-height:1.55}
input{accent-color:var(--acc)}input[type=color]{width:34px;height:32px;padding:3px;border:1px solid var(--line);border-radius:6px;background:var(--card)}input[type=range]{width:100px}input[type=checkbox]{width:17px;height:17px;margin:0}
#sw{display:inline-flex;gap:4px}#sw i{width:17px;height:17px;border-radius:50%;border:1px solid #0002}
.chart-options{display:grid;gap:14px;font-size:12px}.control-row{display:grid;gap:12px 18px;align-items:center;padding-bottom:14px;border-bottom:1px solid var(--line)}.control-row label,.palette-control{display:flex;align-items:center;gap:7px;min-width:0;color:var(--mut)}.control-row select{min-width:0;font-size:12px;padding:8px}.primary-controls{grid-template-columns:minmax(280px,2fr) minmax(230px,1.25fr) minmax(190px,1fr)}.primary-controls label{display:grid;grid-template-columns:auto minmax(0,1fr)}.primary-controls input,.primary-controls select{width:100%}.primary-controls input[type=text]{padding:7px 10px}.color-controls{grid-template-columns:minmax(250px,1fr) auto auto auto;gap:12px}.palette-control{min-width:0}.palette-control label{display:flex;align-items:center;gap:7px}.background-control{display:flex;align-items:center;gap:9px;padding:6px 9px;border:1px solid var(--line);border-radius:8px;background:var(--bg)}.background-control label{white-space:nowrap}.checkbox-control,.data-opacity-control{white-space:nowrap}.data-opacity-control input[type=range]{width:82px}.detail-controls{display:flex;flex-wrap:wrap}.custom-palette{display:flex;align-items:center;gap:12px 18px;padding:11px 13px;border:1px solid var(--pro-line);border-radius:9px;background:var(--pro-bg);color:var(--pro-ink);font-weight:650}.custom-colors{display:flex;gap:7px;flex-wrap:wrap}.custom-colors label{display:block}.custom-colors input[type=color]{width:38px;height:34px}.animation-box{margin:0;padding:10px 13px 12px;border:1px solid var(--pro-line);border-radius:10px;background:var(--pro-bg);color:var(--pro-ink)}.animation-box legend{padding:0 7px;font-weight:750}.animation-box .mini-pro{border-color:var(--pro-line);color:var(--pro-ink);background:var(--card)}.animation-controls{display:flex;align-items:center;gap:12px 20px;flex-wrap:wrap}.animation-controls label{display:flex;align-items:center;gap:7px}.animation-box .hint{margin:8px 0 0;color:var(--pro-ink)}.chart-options>#reset{justify-self:start}.visually-hidden{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
.hint,.muted{color:var(--mut);font-size:12px}.hint{margin:12px 0 0}
.info,.warning,.error{font-size:13px;overflow-wrap:anywhere;margin:0}.info:not(:empty),.warning:not(:empty),.error:not(:empty){padding:11px 13px;margin:10px 0;border-left:3px solid var(--acc);background:var(--card)}.warning:not(:empty){color:var(--warn);background:var(--warn-bg);border-color:var(--warn)}.error:not(:empty){color:var(--danger);border-color:var(--danger)}
#grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,460px),1fr));gap:18px;margin-top:18px}.card{min-width:0;background:var(--card);border:1px solid var(--line);border-radius:14px;padding:16px;box-shadow:var(--shadow)}.card header{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:12px;padding-bottom:10px;border-bottom:1px solid var(--line)}.card header span{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}.card header button{display:inline-flex;align-items:center;justify-content:center;gap:7px;font-size:12px;padding:8px 10px}.card header .animated-export:disabled{opacity:1;background:#e5e7eb;border-color:#cbd5e1;color:#6b7280}.card header .animated-export:disabled .download-icon{color:#6b7280}.download-icon{display:block;width:21px;height:21px;flex:none;color:var(--acc)}.card h2{font-size:15px;margin:0;letter-spacing:-.01em}.chart{height:320px;width:100%}
@media (prefers-color-scheme:dark){.card header .animated-export:disabled{background:#26383f;border-color:#41545c;color:#9aadb4}.card header .animated-export:disabled .download-icon{color:#9aadb4}}
.pro-card{display:grid;grid-template-columns:1fr auto;gap:20px;margin-top:34px;padding:24px;border:1px solid var(--line);border-radius:16px;background:var(--card);box-shadow:var(--shadow)}.pro-card h2{margin:2px 0 8px}.pro-card p{margin:7px 0;color:var(--mut)}.eyebrow{font-size:11px!important;font-weight:800;text-transform:uppercase;letter-spacing:1.3px;color:var(--acc)!important}.price strong{color:var(--ink);font-size:19px}.pro-actions{display:flex;align-items:center;align-content:center;gap:8px;flex-wrap:wrap;justify-content:flex-end}.license-panel{grid-column:1/-1;padding-top:17px;border-top:1px solid var(--line)}.license-input-row{display:flex;gap:8px;margin-top:7px}.license-input-row input{flex:1;min-width:180px}.license-status{font-size:13px}.link-button{padding:0;border:0;background:none;color:var(--acc);min-height:34px;text-decoration:underline;text-underline-offset:3px}
.faq{max-width:820px;margin-top:38px}.faq h2{font-size:23px}.faq details{border-top:1px solid var(--line);padding:12px 0}.faq details:last-child{border-bottom:1px solid var(--line)}.faq summary{cursor:pointer;font-weight:650}.faq p{color:var(--mut);margin:9px 0 3px}
footer{display:grid;grid-template-columns:1fr auto;gap:14px 24px;align-items:center;margin-top:38px;padding-top:18px;border-top:1px solid var(--line);color:var(--mut);font-size:11px}.privacy{display:inline-flex;align-items:center;gap:7px}.privacy svg{width:15px;height:15px;color:var(--acc)}footer nav{display:flex;gap:8px 16px;flex-wrap:wrap}footer .footer-brand{grid-column:2;justify-self:end}
.legal-page{max-width:820px}.legal-page section{margin:30px 0}.placeholder{border:1px solid var(--warn);background:var(--warn-bg);padding:12px;border-radius:8px;color:var(--warn)}
[hidden]{display:none!important}
@media(max-width:950px){.color-controls{grid-template-columns:1fr}.palette-control{flex-wrap:wrap}.mapping-options{grid-template-columns:1fr}}
@media(max-width:850px){.primary-controls{grid-template-columns:1fr}.custom-palette{align-items:flex-start;flex-direction:column}}
@media(max-width:700px){main{padding:20px 16px 32px}.brand{margin-bottom:28px;padding-bottom:18px}.brand-by{font-size:10px;gap:4px}.brand-by .axtm-logo{width:22px;height:17px}.wordmark{font-size:22px}.brand-logo{width:30px;height:34px}h1{font-size:35px}.sub{font-size:14px}.drop{min-height:215px;padding:22px 14px}.import-actions>button{flex:1 1 160px}.opts{gap:14px}.mapping-options{grid-template-columns:1fr}.values-table{grid-template-columns:1fr}.panel{padding:14px}.card{padding:10px}.chart{height:300px}.primary-controls label{grid-template-columns:1fr}.primary-controls input,.primary-controls select{margin-top:3px}.animation-controls{align-items:stretch;flex-direction:column}.animation-controls label{justify-content:space-between}.animation-controls input[type=range]{flex:1}.pro-card{grid-template-columns:1fr}.pro-actions{justify-content:flex-start}.license-input-row{align-items:stretch;flex-direction:column}footer{grid-template-columns:1fr}footer .footer-brand{grid-column:auto;justify-self:start}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}
