:root{--bg:#0a192f;--panel:#0e2942;--panel-2:#143650;--line:#33505c;--text:#e0f2fe;--muted:#9fb6c9;--accent:#2fa6b8;--accent-2:#4cb8f5;--on-accent:#06202b;--gold:#d4af37;--gold-lite:#f7e7ce;--on-gold:#0a192f;--danger:#f87171;--radius:14px;--font:"IBM Plex Sans Thai", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--spring:cubic-bezier(.34, 1.56, .64, 1);--shadow:0 2px 16px #03071280;--shadow-lg:0 18px 46px #03071299}@media (prefers-color-scheme:light){:root:not([data-theme=dark]){--bg:#eef4f8;--panel:#fff;--panel-2:#e6f0f5;--line:#cbd9e1;--text:#0a192f;--muted:#42606b;--accent:#0e7c8c;--accent-2:#0b74c4;--on-accent:#fff;--gold:#d4af37;--gold-lite:#f7e7ce;--on-gold:#0a192f;--danger:#dc2626;--shadow:0 1px 2px #16203c0d, 0 12px 30px -14px #16203c33;--shadow-lg:0 18px 46px -18px #16203c52}}:root[data-theme=light]{--bg:#eef4f8;--panel:#fff;--panel-2:#e6f0f5;--line:#cbd9e1;--text:#0a192f;--muted:#42606b;--accent:#0e7c8c;--accent-2:#0b74c4;--on-accent:#fff;--gold:#d4af37;--gold-lite:#f7e7ce;--on-gold:#0a192f;--danger:#dc2626;--shadow:0 1px 2px #16203c0d, 0 12px 30px -14px #16203c33;--shadow-lg:0 18px 46px -18px #16203c52}*{box-sizing:border-box}html{overflow-x:clip}body{background:var(--bg);min-height:100vh;color:var(--text);font-family:var(--font);-webkit-font-smoothing:antialiased;margin:0;line-height:1.65;overflow-x:clip}.glow{background:radial-gradient(48% 60% at 18% 32%, color-mix(in srgb, var(--accent) 30%, transparent), transparent 72%), radial-gradient(44% 58% at 82% 26%, color-mix(in srgb, var(--gold) 24%, transparent), transparent 72%), radial-gradient(50% 62% at 52% 8%, color-mix(in srgb, var(--accent-2) 20%, transparent), transparent 74%);filter:blur(26px);pointer-events:none;z-index:0;will-change:transform;height:74vh;animation:24s ease-in-out infinite alternate fm-aurora;position:fixed;inset:-30% 0 auto}@keyframes fm-aurora{0%{transform:translate(0,0)scale(1)}50%{transform:translate(2.5%,2%)scale(1.08)}to{transform:translate(-2%,1%)scale(1.04)}}main,.site-header,.site-footer{z-index:1;max-width:940px;margin:0 auto;padding:0 20px;position:relative}.site-header{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:16px;padding-top:28px;padding-bottom:8px;display:flex}.brand{color:var(--text);align-items:center;gap:10px;font-weight:700;text-decoration:none;display:flex}.brand-mark{object-fit:cover;object-position:50% 8%;background:radial-gradient(120% 120% at 50% 20%,#12335a,#0a192f);border:2px solid #d4af37;border-radius:50%;width:40px;height:40px;display:block}.brand-name{letter-spacing:.02em;font-family:Anton,IBM Plex Sans Thai,sans-serif;font-size:1.35rem;font-weight:400}.brand .ta{color:var(--gold)}.badge{border:1px solid var(--line);background:var(--panel);white-space:nowrap;color:var(--muted);border-radius:999px;align-items:center;gap:8px;padding:6px 12px;font-size:.82rem;display:inline-flex}.dot{background:var(--accent);width:7px;height:7px;box-shadow:0 0 0 3px color-mix(in srgb, var(--accent) 25%, transparent);border-radius:50%}.hero{padding:40px 0 28px}.hero h1{letter-spacing:-.5px;overflow-wrap:anywhere;min-width:0;margin:0 0 14px;font-size:clamp(2rem,5.5vw,3rem);line-height:1.25}.accent{background:linear-gradient(100deg, var(--accent), var(--accent-2));color:#0000;-webkit-background-clip:text;background-clip:text}.lede{max-width:60ch;color:var(--muted);margin:0}.dropzone{border:1.5px dashed color-mix(in srgb, var(--accent) 45%, var(--line));background:color-mix(in srgb, var(--panel) 80%, transparent);box-shadow:var(--shadow);text-align:center;cursor:pointer;transition:border-color .18s, background .18s, box-shadow .18s, transform .18s var(--spring);border-radius:22px;padding:46px 24px}.dropzone:hover,.dropzone:focus-visible{border-color:var(--accent);background:var(--panel);box-shadow:var(--shadow-lg);outline:none}.dropzone:active{transform:scale(.99)}.dropzone.dragging{border-color:var(--accent);background:color-mix(in srgb, var(--accent) 10%, var(--panel));transform:scale(1.01)}.dropzone-icon{background:var(--panel-2);border:1px solid var(--line);width:52px;height:52px;color:var(--accent);border-radius:16px;place-items:center;margin:0 auto 14px;font-size:26px;font-weight:300;display:grid}.dropzone-title{margin:0;font-weight:600}.dropzone-hint{color:var(--muted);margin:4px 0 0;font-size:.88rem}.queue-section{margin-top:34px}.queue-toolbar{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;margin-bottom:14px;display:flex}.queue-toolbar h2{margin:0;font-size:1.05rem}.count{background:var(--panel-2);border:1px solid var(--line);min-width:22px;color:var(--muted);text-align:center;border-radius:999px;margin-left:4px;padding:0 7px;font-size:.8rem;display:inline-block}.toolbar-actions{gap:8px;display:flex}.btn{font:inherit;cursor:pointer;transition:filter .15s, background .15s, border-color .15s, transform .15s var(--spring);border:1px solid #0000;border-radius:11px;padding:10px 18px;font-weight:600}.btn:not(:disabled):active{transform:scale(.96)}.btn:disabled{opacity:.5;cursor:not-allowed}.btn-primary{background:linear-gradient(135deg, var(--gold-lite), var(--gold));color:var(--on-gold);box-shadow:0 8px 22px -10px color-mix(in srgb, var(--gold) 70%, transparent)}.btn-primary:not(:disabled):hover{filter:brightness(1.08)}.btn-ghost{border-color:var(--line);color:var(--muted);background:0 0}.btn-ghost:not(:disabled):hover{border-color:var(--text);color:var(--text)}.btn-sm{padding:6px 14px;font-size:.86rem}.queue{gap:10px;margin:0;padding:0;list-style:none;display:grid}.item{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);grid-template-columns:38px minmax(0,1fr) auto;align-items:center;gap:14px;padding:14px 16px;display:grid}.item.error{border-color:color-mix(in srgb, var(--danger) 50%, var(--line))}.item.done{border-color:color-mix(in srgb, var(--gold) 45%, var(--line))}.item-icon{background:var(--panel-2);border-radius:10px;place-items:center;width:38px;height:38px;font-size:18px;display:grid}.item-name{text-overflow:ellipsis;white-space:nowrap;font-weight:600;overflow:hidden}.item-meta{color:var(--muted);font-size:.82rem}.item-meta.err{color:var(--danger)}.item-actions{align-items:center;gap:8px;display:flex}select{font:inherit;background:var(--panel-2);color:var(--text);border:1px solid var(--line);cursor:pointer;border-radius:9px;padding:7px 10px;font-size:.88rem}select:disabled{opacity:.6;cursor:not-allowed}.bar{background:var(--panel-2);border-radius:999px;grid-column:2/-1;height:4px;overflow:hidden}.bar>i{background:linear-gradient(90deg, var(--accent), var(--accent-2));width:0;height:100%;transition:width .2s;display:block}.icon-btn{cursor:pointer;color:var(--muted);background:0 0;border:none;border-radius:8px;padding:4px 6px;font-size:1.1rem;line-height:1}.icon-btn:hover{color:var(--danger);background:var(--panel-2)}a.download{background:color-mix(in srgb, var(--accent) 16%, transparent);border:1px solid color-mix(in srgb, var(--accent) 45%, transparent);color:var(--accent);border-radius:10px;padding:7px 15px;font-size:.86rem;font-weight:600;text-decoration:none;display:inline-block}a.download:hover{background:color-mix(in srgb, var(--accent) 26%, transparent)}.formats{margin:52px 0 20px}.formats h2{margin:0 0 14px;font-size:1.05rem}.format-table{gap:10px;display:grid}.format-row{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);grid-template-columns:120px minmax(0,1fr);gap:14px;padding:14px 16px;font-size:.88rem;display:grid}.format-row b{font-weight:600}.format-row span{color:var(--muted);word-break:break-word}.note{color:var(--muted);margin-top:16px;font-size:.82rem}code{background:var(--panel-2);border:1px solid var(--line);border-radius:5px;padding:1px 5px;font-size:.85em}.site-footer{color:var(--muted);text-align:center;padding:30px 20px 44px;font-size:.82rem}@media (max-width:620px){.item{grid-template-columns:38px minmax(0,1fr)}.item-actions{grid-column:1/-1;justify-content:flex-end}.bar{grid-column:1/-1}.format-row{grid-template-columns:1fr;gap:4px}}.only-touch{display:none}@media (pointer:coarse){.only-mouse{display:none}.only-touch{display:inline}}.notes{border:1px solid var(--line);border-radius:var(--radius);background:var(--panel);margin-top:18px;overflow:hidden}.notes summary{cursor:pointer;justify-content:space-between;align-items:center;gap:12px;padding:14px 16px;font-size:.92rem;font-weight:600;list-style:none;transition:background .15s;display:flex}.notes summary::-webkit-details-marker{display:none}.notes summary:hover{background:var(--panel-2)}.notes summary:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}.summary-text:before{content:"ℹ️ "}.chevron{color:var(--muted);transition:transform .2s}.notes[open] .chevron{transform:rotate(180deg)}.note-list{counter-reset:none;gap:14px;margin:0;padding:4px 20px 6px 40px;display:grid}.note-list li{padding-right:4px}.note-list li::marker{color:var(--accent);font-weight:700}.note-list b{margin-bottom:2px;font-size:.92rem;display:block}.note-list span{color:var(--muted);font-size:.86rem;line-height:1.65;display:block}.notes .note{border-top:1px solid var(--line);margin:4px 16px 16px;padding-top:14px}.format-row,.notes{box-shadow:var(--shadow)}.theme-toggle{font:inherit;cursor:pointer;white-space:nowrap;border:1px solid var(--line);background:var(--panel);min-height:38px;color:var(--muted);transition:transform .15s var(--spring), color .15s, border-color .15s;border-radius:999px;align-items:center;gap:7px;padding:0 14px;font-size:.82rem;font-weight:600;display:inline-flex}.theme-toggle:hover{color:var(--text);border-color:color-mix(in srgb, var(--accent) 45%, var(--line))}.theme-toggle:active{transform:scale(.94)}.theme-toggle .ic{font-size:1rem;line-height:1}.header-actions{flex-wrap:wrap;align-items:center;gap:10px;display:flex}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important}}.fm-battle{--beat:1.15s;--foe:#5b4694;--foe-dark:#3c2e66;--foe-eye:#ff6b6b;background:linear-gradient(120deg, color-mix(in srgb, var(--accent) 10%, var(--panel)), var(--panel) 60%);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);grid-template-columns:minmax(0,290px) minmax(0,1fr);align-items:center;gap:18px;margin-bottom:14px;padding:10px 18px 10px 10px;display:grid;overflow:hidden}:root[data-theme=light] .fm-battle,:root:not([data-theme=dark]) .fm-battle{--foe:#6d5aa8;--foe-dark:#4b3c7e}.fm-stage{width:100%;height:168px;position:relative}.fm-hero{width:168px;animation:fm-lunge var(--beat) cubic-bezier(.3, .9, .2, 1) infinite;position:absolute;top:0;bottom:0;left:0}.fm-pose{object-fit:contain;object-position:bottom center;width:100%;height:100%;position:absolute;inset:0}.fm-pose--idle{animation:fm-frame-idle var(--beat) steps(1) infinite}.fm-pose--punch{opacity:0;animation:fm-frame-punch var(--beat) steps(1) infinite}.fm-pose--win{opacity:0}.fm-foe-art{width:104px;height:132px;position:absolute;bottom:4px;left:152px;overflow:visible}.fm-foe-shadow{fill:#00000047}:root[data-theme=light] .fm-foe-shadow{fill:#16203c29}.fm-foe-body{fill:var(--foe)}.fm-foe-horn{fill:var(--foe-dark)}.fm-foe-face circle{fill:var(--foe-eye)}.fm-foe-face path{stroke:var(--foe-eye);stroke-width:3px;fill:none}.fm-foe-face path:last-child{stroke:var(--foe-dark);stroke-width:3px}.fm-foe-tag rect{fill:var(--panel-2);stroke:var(--line)}.fm-foe-label{fill:var(--muted);font:700 11px var(--font);letter-spacing:.3px}.fm-foe{animation:fm-hit var(--beat) ease-out infinite;transform-origin:222px 82px}.fm-info{min-width:0}.fm-title{margin:0 0 10px;font-size:.95rem;font-weight:600}.fm-eta{color:var(--muted);margin:8px 0 0;font-size:.85rem}.fm-score{color:var(--gold);margin:4px 0 0;font-size:.8rem;font-weight:600}.fm-bar{background:var(--panel-2);border-radius:999px;height:6px;overflow:hidden}.fm-bar>i{background:linear-gradient(90deg, var(--accent), var(--accent-2));border-radius:999px;width:0;height:100%;transition:width .3s ease-out;display:block}.fm-bar.is-indeterminate>i{width:38%;animation:1.3s ease-in-out infinite fm-sweep}.fm-battle.is-won .fm-hero{animation:none}.fm-battle.is-won .fm-pose--idle,.fm-battle.is-won .fm-pose--punch{opacity:0;animation:none}.fm-battle.is-won .fm-pose--win{opacity:1;animation:fm-pop .5s var(--spring)}.fm-battle.is-won .fm-foe{animation:.9s cubic-bezier(.3,.8,.3,1) forwards fm-ko}@keyframes fm-frame-idle{0%,47%{opacity:1}48%,86%{opacity:0}87%,to{opacity:1}}@keyframes fm-frame-punch{0%,47%{opacity:0}48%,86%{opacity:1}87%,to{opacity:0}}@keyframes fm-lunge{0%,30%{transform:translate(0)}44%{transform:translate(-4px,1px)}52%{transform:translate(9px,-2px)}76%{transform:translate(7px,-1px)}to{transform:translate(0)}}@keyframes fm-hit{0%,50%{transform:none}56%{transform:translate(13px)scale(.9,1.08)rotate(5deg)}70%{transform:translate(5px)rotate(-2deg)}to{transform:none}}@keyframes fm-pop{0%{transform:scale(.82)}to{transform:scale(1)}}@keyframes fm-sweep{0%{transform:translate(-110%)}to{transform:translate(320%)}}@keyframes fm-ko{to{opacity:0;transform:translate(150px,-70px)rotate(48deg)}}@media (max-width:620px){.fm-battle{grid-template-columns:1fr;gap:6px;padding:10px 16px 14px}.fm-stage{width:282px;height:156px;margin:0 auto}}@media (prefers-reduced-motion:reduce){.fm-hero,.fm-pose,.fm-foe,.fm-bar.is-indeterminate>i,.fm-battle.is-won .fm-foe,.fm-battle.is-won .fm-pose--win{animation:none!important}.fm-pose--idle{opacity:0}.fm-pose--punch{opacity:1}.fm-bar.is-indeterminate>i{opacity:.5;width:100%}}.warm-note{background:color-mix(in srgb, var(--accent) 10%, transparent);border:1px solid color-mix(in srgb, var(--accent) 28%, transparent);color:var(--muted);border-radius:10px;margin:0 0 12px;padding:8px 12px;font-size:.82rem}html:root:not([data-theme=light]){--bg:#0a192f;--panel:#0e2942;--panel-2:#0c2440;--line:#33505c;--text:#e0f2fe;--muted:#9fb6c9;--accent:#d4af37;--accent-2:#d4af37;--on-accent:#0a192f;--gold:#d4af37;--on-gold:#0a192f;--shadow:0 20px 45px -26px #000000b3;--shadow-lg:0 26px 56px -28px #000000c7;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}html:root[data-theme=light]{--bg:#eef4f8;--panel:#fff;--panel-2:#e6f0f5;--line:#cbd9e1;--text:#0a192f;--muted:#42606b;--accent:#005f73;--accent-2:#005f73;--on-accent:#fff;--gold:#b8912a;--on-gold:#0a192f;--shadow:0 20px 45px -26px #18243c6b;--shadow-lg:0 26px 56px -28px #18243c80;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}
