@font-face{font-family:"Rajdhani";font-style:normal;font-weight:600;font-display:swap;src:url("./assets/fonts/rajdhani-600-latin-ext.woff2") format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Rajdhani";font-style:normal;font-weight:600;font-display:swap;src:url("./assets/fonts/rajdhani-600-latin.woff2") format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"JetBrains Mono";font-style:normal;font-weight:400;font-display:swap;src:url("./assets/fonts/jetbrains-mono-400-latin-ext.woff2") format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"JetBrains Mono";font-style:normal;font-weight:400;font-display:swap;src:url("./assets/fonts/jetbrains-mono-400-latin.woff2") format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

:root{color-scheme:dark;--page:#0a0a0f;--surface:rgb(17 18 23/.96);--surface-strong:#171820;--surface-hover:#1d1f29;--text:#f2f2f2;--muted:#a3a3b5;--ghost:#70708a;--line:rgb(63 66 78/.86);--accent:#00b4d8;--accent-strong:#67ddf2;--accent-ink:#00171c;--accent-dim:rgb(0 180 216/.14);--focus:rgb(0 180 216/.55);--danger:#ff8d8d;--warning:#f4c95d;--shadow:rgb(0 0 0/.34);--font-display:"Rajdhani","Arial Narrow",sans-serif;--font-mono:"JetBrains Mono","Courier New",monospace;--font-body:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI","Noto Sans",sans-serif;font-family:var(--font-body)}
:root[data-theme="light"]{color-scheme:light;--page:#f2f2ee;--surface:rgb(255 255 255/.96);--surface-strong:#f4f5f4;--surface-hover:#e9f2f3;--text:#1a1a28;--muted:#5d5d70;--ghost:#77778b;--line:rgb(160 163 170/.88);--accent:#006b80;--accent-strong:#004d5e;--accent-ink:#fff;--accent-dim:rgb(0 107 128/.1);--focus:rgb(0 107 128/.45);--danger:#a32626;--warning:#8a5b00;--shadow:rgb(27 30 38/.13)}
:root[data-theme="dark"]{color-scheme:dark}
@media(prefers-color-scheme:light){:root[data-theme="system"]{color-scheme:light;--page:#f2f2ee;--surface:rgb(255 255 255/.96);--surface-strong:#f4f5f4;--surface-hover:#e9f2f3;--text:#1a1a28;--muted:#5d5d70;--ghost:#77778b;--line:rgb(160 163 170/.88);--accent:#006b80;--accent-strong:#004d5e;--accent-ink:#fff;--accent-dim:rgb(0 107 128/.1);--focus:rgb(0 107 128/.45);--danger:#a32626;--warning:#8a5b00;--shadow:rgb(27 30 38/.13)}}

*{box-sizing:border-box}html{min-width:320px;background:var(--page)}body{margin:0;min-width:320px;color:var(--text);background-color:var(--page);background-image:linear-gradient(rgb(127 127 148/.045) 1px,transparent 1px),linear-gradient(90deg,rgb(127 127 148/.045) 1px,transparent 1px);background-size:28px 28px;-webkit-font-smoothing:antialiased}[hidden]{display:none!important}.shell{width:min(900px,calc(100% - 2rem));margin-inline:auto}.layout{display:grid;grid-template-columns:minmax(0,1fr);gap:.6rem;padding-bottom:2rem}
h1,h2,.accordion-trigger>span:first-child{font-family:var(--font-display);font-weight:600}h1{margin:.08em 0;font-size:clamp(2.45rem,8vw,4.4rem);line-height:.92;letter-spacing:.01em}h2{margin:0;font-size:1.28rem;letter-spacing:.02em}.eyebrow,.brand,.accordion-summary,#widget-url,#action-status,#counter-placeholder{font-family:var(--font-mono)}.eyebrow{margin:0;color:var(--accent-strong);font-size:.72rem;letter-spacing:.16em}.lead{max-width:62ch;margin:.45rem 0 0;color:var(--muted);font-size:1rem;line-height:1.5}.hero{padding:1.35rem 0 .4rem}

.topbar{position:sticky;z-index:30;top:0;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:.8rem;padding:.65rem clamp(.75rem,3vw,2rem);border-bottom:1px solid var(--line);background:color-mix(in srgb,var(--page),transparent 5%);backdrop-filter:blur(14px)}.brand{display:flex;min-height:44px;align-items:center;color:var(--accent-strong);font-size:.76rem;font-weight:700;letter-spacing:.15em;text-decoration:none}.tool-nav{display:flex;justify-self:center;align-items:center;gap:2px;padding:3px;border:1px solid var(--line);border-radius:3px;background:var(--surface)}.tool-nav a{display:flex;min-height:44px;align-items:center;padding:.55rem .8rem;color:var(--muted);border:1px solid transparent;border-radius:2px;text-decoration:none;font-size:.84rem;font-weight:700}.tool-nav a:hover{color:var(--text);background:var(--surface-hover)}.tool-nav a[aria-current="page"]{color:var(--accent-ink);background:var(--accent);border-color:var(--accent)}.global-controls{display:flex;align-items:end;gap:.55rem}.global-controls>label,.language-control{display:grid;gap:.2rem;margin:0;color:var(--muted);font-family:var(--font-mono);font-size:.67rem}.global-controls select{min-width:8rem}.language-control{min-width:min(13rem,32vw)}

.card{position:relative;margin:0 0 .05rem;padding:1rem;background:var(--surface);border:1px solid var(--line);border-radius:3px;box-shadow:0 .7rem 1.8rem var(--shadow)}.card::before{content:"";position:absolute;top:-1px;left:-1px;width:16px;height:2px;background:var(--accent)}.welcome{padding:.95rem 1rem}.welcome h2{font-size:1.45rem}.welcome p{margin:.35rem 0;color:var(--muted);line-height:1.5}.welcome-closing{color:var(--text)!important;font-weight:700}.step-overview{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:.45rem;margin:.75rem 0;padding:0;list-style:none;counter-reset:steps}.step-overview li{position:relative;min-width:0;padding:.5rem .45rem .5rem 2rem;border-left:1px solid var(--line);color:var(--muted);font-size:.78rem;line-height:1.35;counter-increment:steps}.step-overview li::before{content:counter(steps);position:absolute;top:.35rem;left:.45rem;color:var(--accent-strong);font-family:var(--font-display);font-size:1.35rem;font-weight:600}

.accordion-step{padding:0;overflow:visible}.accordion-heading{margin:0}.accordion-trigger{display:grid;grid-template-columns:minmax(0,1fr) auto;width:100%;min-height:58px;align-items:center;gap:.15rem 1rem;padding:.62rem .9rem;border:0;border-radius:2px;background:transparent;color:var(--text);text-align:left}.accordion-trigger:hover{background:var(--accent-dim)}.accordion-trigger::after{content:"+";grid-column:2;grid-row:1/-1;color:var(--accent-strong);font-family:var(--font-mono);font-size:1.2rem}.accordion-trigger[aria-expanded="true"]::after{content:"−"}.accordion-trigger>span:first-child{font-size:1.08rem;letter-spacing:.025em}.accordion-summary{grid-column:1;overflow:hidden;color:var(--muted);font-size:.69rem;font-weight:400;text-overflow:ellipsis;white-space:nowrap}.accordion-body{padding:.25rem .9rem .95rem;border-top:1px solid var(--line)}.accordion-body>label{margin-top:.65rem}.accordion-body fieldset{margin:.7rem 0}.accordion-body .field-help{font-size:.82rem}.hide-controls{padding-top:.35rem;border-top:1px solid var(--line)}

label,legend{display:block;margin:.3rem 0;color:var(--text);font-size:.88rem;font-weight:700}.field-help{margin:.45rem 0 0;color:var(--muted);line-height:1.45}.grid-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.65rem}.wide{grid-column:1/-1}fieldset{min-width:0;border:0;padding:0}.choice-row{display:flex;flex-wrap:wrap;gap:.3rem .7rem}.choice-row label,.toggle-row{display:flex;min-height:44px;align-items:center;gap:.42rem;margin:0;padding:.3rem .15rem}
input,select,button{min-height:44px;border:1px solid var(--line);border-radius:2px;padding:.55rem .68rem;color:var(--text);background:var(--surface-strong);font:inherit;transition:border-color .15s ease,background-color .15s ease,color .15s ease,box-shadow .15s ease}input:not([type="checkbox"]):not([type="radio"]),select{width:100%}input[type="checkbox"],input[type="radio"]{width:22px;min-height:22px;margin:0;padding:0;accent-color:var(--accent)}input[type="color"]{padding:.25rem}input:hover,select:hover{border-color:var(--ghost)}input:disabled,select:disabled,button:disabled{cursor:not-allowed;opacity:.48}input:focus-visible,select:focus-visible,button:focus-visible,a:focus-visible{outline:3px solid var(--focus);outline-offset:2px}.accordion-trigger:focus-visible{position:relative;z-index:1}button{color:var(--accent-ink);background:var(--accent);border-color:var(--accent);font-weight:800;cursor:pointer}button:hover:not(:disabled){background:var(--accent-strong);border-color:var(--accent-strong)}.actions{display:flex;gap:.55rem;margin-top:.65rem}.field-error,.form-error{min-height:1.2em;margin:.2rem 0;color:var(--danger);font-size:.82rem}.warning{margin:.65rem 0;border-left:3px solid var(--warning);padding:.2rem 0 .2rem .7rem;color:var(--muted);line-height:1.45}

.anchor-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.4rem;max-width:42rem}.anchor-grid label{position:relative;display:flex;min-height:50px;align-items:center;justify-content:center;margin:0;padding:.4rem;text-align:center;border:1px solid var(--line);border-radius:2px;background:var(--surface-strong);cursor:pointer}.anchor-grid label:hover{border-color:var(--ghost);background:var(--surface-hover)}.anchor-grid input{position:absolute;inset:.3rem auto auto .3rem}.anchor-grid label:has(input:checked){border-color:var(--accent);background:var(--accent-dim);box-shadow:inset 2px 0 0 var(--accent)}
.timezone-combobox{position:relative}.timezone-options{position:absolute;z-index:20;top:calc(100% + .2rem);right:0;left:0;max-height:16rem;overflow:auto;padding:.2rem;border:1px solid var(--line);border-radius:2px;background:var(--surface-strong);box-shadow:0 .75rem 2rem var(--shadow)}.timezone-options[hidden]{display:none}.timezone-options [role="option"]{padding:.55rem .65rem;border-radius:2px;cursor:pointer}.timezone-options [role="option"][aria-selected="true"],.timezone-options [role="option"]:hover{background:var(--accent-dim);color:var(--accent-strong)}

.preview-heading,.preview-toolbar{display:flex;align-items:center;justify-content:space-between;gap:.75rem;flex-wrap:wrap}.preview-heading label{display:flex;align-items:center;gap:.45rem}.preview-toolbar fieldset{margin:.35rem 0}.preview{aspect-ratio:16/9;overflow:hidden;border:1px solid var(--line);border-radius:2px;background-color:#eaf2f0;background-image:linear-gradient(45deg,#8ca8a1 25%,transparent 25%),linear-gradient(-45deg,#8ca8a1 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#8ca8a1 75%),linear-gradient(-45deg,transparent 75%,#8ca8a1 75%);background-position:0 0,0 14px,14px -14px,-14px 0;background-size:28px 28px}.preview[data-preview-background="light"]{background:#f5f7fa}.preview[data-preview-background="dark"]{background:#101820}.preview[data-preview-background="chroma"]{background:#00b140}.preview iframe{width:100%;height:100%;border:0;background:transparent}

ol{padding-left:1.25rem;line-height:1.5}.privacy-card{margin-top:.25rem}.privacy-card h2{color:var(--accent-strong)}.privacy-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.45rem 1.2rem;margin:.65rem 0 0;padding-left:1.15rem;color:var(--muted);font-size:.82rem;line-height:1.45}.privacy-list li:last-child{grid-column:1/-1}#thanks{margin-top:.05rem}#thanks p{margin:.35rem 0 0;color:var(--muted);font-size:.75rem;line-height:1.5}

@media(max-width:820px){.topbar{position:static;grid-template-columns:1fr auto}.tool-nav{justify-self:end}.global-controls{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr}.language-control{min-width:0}.step-overview{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:620px){.shell{width:min(100% - 1rem,900px)}.hero{padding-top:1rem}.grid-fields,.privacy-list{grid-template-columns:1fr}.wide,.privacy-list li:last-child{grid-column:auto}.welcome{font-size:.94rem}.step-overview{grid-template-columns:1fr;gap:.2rem}.accordion-trigger{padding:.58rem .75rem}.accordion-body{padding:.2rem .75rem .8rem}.accordion-summary{max-width:74vw}.actions,.preview-toolbar{align-items:stretch;flex-direction:column}.anchor-grid label{min-height:56px;font-size:.76rem}}
@media(max-width:480px){.topbar{grid-template-columns:1fr}.tool-nav{justify-self:start}.global-controls{grid-template-columns:1fr}.card{padding:.85rem}.accordion-step{padding:0}.hero h1{font-size:2.5rem}}
.global-controls>label,.language-control{font-weight:400}.language-control>label{display:block;margin:0;color:inherit;font:inherit;font-weight:400}.global-controls select{height:44px;min-height:44px;padding:.55rem .68rem;border:1px solid var(--line);border-radius:2px;color:var(--text);background:var(--surface-strong);font:inherit;font-weight:400;line-height:normal}
@media(max-width:820px){.language-control{min-width:0}}
.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}.global-controls{align-items:center}.header-control{display:flex;min-width:0;align-items:center;gap:.42rem;color:var(--muted)}.header-control select{width:auto;min-width:0}.theme-control select{width:auto;min-width:max-content;field-sizing:content}.language-control{min-width:0}.language-control select{width:10.5rem}.control-icon,.control-icons svg{flex:0 0 auto;width:1.2rem;height:1.2rem;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.control-icons{display:grid;flex:0 0 1.2rem;place-items:center}.control-icons svg{display:none;grid-area:1/1}html[data-theme="system"] [data-theme-icon="system"],html[data-theme="light"] [data-theme-icon="light"],html[data-theme="dark"] [data-theme-icon="dark"]{display:block}@media(max-width:820px){.header-control select{width:100%}.theme-control select,.language-control select{width:100%;min-width:0}}
.usage-footer-heading{display:flex;align-items:center;justify-content:space-between;gap:.75rem}.share-tool-button{display:inline-flex;flex:0 0 auto;min-height:36px;align-items:center;gap:.4rem;padding:.38rem .62rem;color:var(--accent-strong);border-color:var(--line);background:transparent;font-size:.75rem;font-weight:400}.share-tool-button:hover:not(:disabled){color:var(--text);border-color:var(--accent);background:var(--accent-dim)}.share-tool-icon{width:1rem;height:1rem;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.copy-toast{position:fixed;top:1rem;left:50%;z-index:100;max-width:min(34rem,calc(100% - 2rem));margin:0;padding:.65rem .85rem;color:var(--text);border:1px solid var(--accent);border-radius:3px;background:var(--surface);box-shadow:0 .75rem 2rem var(--shadow);font-size:.8rem;line-height:1.4;transform:translateX(-50%)}.copy-toast[data-tone="error"]{border-color:var(--danger)}@media(max-width:560px){.usage-footer-heading{align-items:flex-start;flex-direction:column}.share-tool-button{align-self:flex-end}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition-duration:.01ms!important}}
.usage-metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.35rem;margin:.4rem 0}.usage-metrics div{min-width:0;padding:.4rem;border:1px solid var(--line);border-radius:2px;background:var(--surface-strong)}.usage-metrics dt{color:var(--muted);font-size:.68rem;line-height:1.25}.usage-metrics dd{margin:.2rem 0 0;color:var(--accent-strong);font-family:var(--font-mono);font-size:1.05rem;font-weight:700}@media(max-width:760px){.usage-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}}
.shell{width:min(1360px,calc(100% - 2rem))}.workspace{display:grid;grid-template-columns:minmax(0,1fr) minmax(26rem,30rem);align-items:start;gap:1rem}.workspace form{display:grid;min-width:0;gap:.6rem}.preview-dock{position:sticky;top:5.5rem;z-index:10;min-width:0;padding:.7rem}.preview-dock-header{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:.75rem}.preview-dock-header h2{min-width:0;font-size:1.08rem;line-height:1.2;overflow-wrap:anywhere}.preview-dock-toggle{width:44px;height:44px;min-height:44px;padding:0;font-family:var(--font-mono);font-size:1.2rem}.preview-dock-body{padding-top:.65rem}.preview-dock-body .preview{width:100%;transition:aspect-ratio .2s ease}
@media(max-width:1099px){body{padding-bottom:calc(4.75rem + env(safe-area-inset-bottom))}.workspace{display:block}.workspace form{display:grid}.preview-dock{position:fixed;right:50%;bottom:max(.5rem,env(safe-area-inset-bottom));top:auto;z-index:40;display:flex;flex-direction:column;width:min(32rem,calc(100% - 1rem));max-height:min(72vh,calc(100dvh - 1rem - env(safe-area-inset-bottom)));margin:0;overflow:hidden;transform:translateX(50%);box-shadow:0 1rem 3rem rgb(0 0 0/.35);transition:max-height .2s ease,box-shadow .2s ease}.preview-dock[data-preview-dock-expanded="false"] .preview-dock-body{display:none}.preview-dock-body{min-height:0;overflow:auto;overscroll-behavior:contain}}
.accordion-trigger>span:first-child{min-width:0;line-height:1.2;overflow-wrap:anywhere}.accordion-summary{line-height:1.35;overflow-wrap:anywhere;white-space:normal}.actions{flex-wrap:wrap;align-items:center}.privacy-card h2,.usage-footer h2{margin:0;font-size:1.28rem;line-height:1.2}.usage-footer{padding:1rem}.usage-footer p{overflow-wrap:anywhere}button{min-height:44px;padding-block:.625rem}
.preview{position:relative}.preview iframe{position:absolute;inset:0;width:auto;height:auto;transform-origin:0 0}.preview-dimensions{color:var(--muted);font-family:var(--font-mono);font-size:.75rem}
.site-footer{width:100%;margin-top:.75rem;border-top:1px solid var(--line);background:color-mix(in srgb,var(--surface),var(--page) 18%)}.site-footer-inner{width:min(1360px,calc(100% - 2rem));margin:0 auto;padding:.65rem 0 .75rem}.footer-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.35fr);gap:.9rem}.footer-grid h2{margin:0 0 .3rem;font-size:.9rem;line-height:1.15}.footer-privacy,.usage-footer{min-width:0}.privacy-copy{max-width:54rem;margin:0;color:var(--muted);font-size:.7rem;line-height:1.4}.privacy-copy span+span::before{content:" · ";color:var(--accent-strong)}.usage-footer{padding:0;box-shadow:none}.usage-footer p{max-width:58rem;margin:.25rem 0;color:var(--muted);font-size:.7rem;line-height:1.4;overflow-wrap:anywhere}@media(max-width:760px){.footer-grid{grid-template-columns:1fr}}@media(max-width:620px){.site-footer-inner{width:min(100% - 1rem,900px)}}