/* Copyright (c) 2026 Noykosana Maeai. All rights reserved. */
:root{--ink:#20364d;--muted:#536b83;--paper:#edf5ff;--line:#d1e2f4;--accent:#216bc4;--dark:#173e68;color-scheme:light;font-family:"Noto Sans Thai",system-ui,sans-serif;color:var(--ink);background:var(--paper)}
*{box-sizing:border-box}body{margin:0}a{color:inherit}button,input{font:inherit}[hidden]{display:none!important}a,button,input,summary,code{scroll-margin-top:24px}:focus-visible{outline:3px solid #3182ce;outline-offset:5px}.skip{position:absolute;left:20px;top:-80px;background:var(--accent);padding:12px;z-index:10}.skip:focus{top:12px}h1,h2,h3,h4,p{margin:0}.plugin-cover{background:linear-gradient(180deg,#dcecff 0,#f3f8ff 100%);color:#173e68;padding-top:1px}
body>header.public-header{width:100%;margin:0;padding:8px max(40px,calc((100% - 1280px)/2));top:0;border:0;border-bottom:1px solid #cbdff5;border-radius:0;background:#f3f8ff;color:#20364d}.public-header-nav a{color:#405f80}.public-header-nav a[aria-current="page"]{color:var(--accent)}.public-header .public-header-start{background:#216bc4;border-color:#216bc4;border-radius:0;color:#fff}.public-header .public-header-start:hover{background:#18549d;border-color:#18549d}
.plugin-hero{max-width:1280px;margin:auto;padding:76px 0 70px;display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:center}.eyebrow,.section-kicker,.study-label,.study-caption,.connection-strip,.workspace-label,.setup-topline,.console-bar{font-family:system-ui,sans-serif;font-size:11px;letter-spacing:1.5px}.eyebrow{display:flex;align-items:center;gap:10px;color:#2369ad;font-size:10px}.eyebrow>span{width:7px;height:7px;background:var(--accent)}h1{font-family:system-ui,sans-serif;font-size:clamp(48px,5vw,76px);letter-spacing:-3px;line-height:1.05;margin:26px 0}h1>span{display:block;color:var(--accent);font-weight:450}.hero-statement{font-size:28px;line-height:1.6;font-weight:500}.hero-description{color:#4b6580;font-size:15px;line-height:1.9;margin-top:18px}.hero-action{display:inline-flex;gap:44px;align-items:center;background:var(--accent);color:#fff;padding:14px 22px;margin-top:28px;font-size:15px;font-weight:650;text-decoration:none}.hero-action:hover{background:#18549d}.vector-study{border:1px solid #adcbed;transform:rotate(-2deg);background:#e5f1ff;padding:18px 18px 14px;box-shadow:12px 14px 0 #c5dcf4}.study-label,.study-caption{display:flex;justify-content:space-between;gap:12px;color:#4b6580;font-size:10px;letter-spacing:1px}.vector-study svg{width:100%;height:auto;display:block;margin:14px 0}.study-caption{border-top:1px solid #adcbed;padding-top:12px;letter-spacing:0}.study-caption span:first-child{color:var(--accent);font-family:"Noto Sans Thai",sans-serif;font-size:14px}.connection-strip{display:flex;justify-content:space-between;gap:20px;max-width:1280px;margin:auto;padding:24px 0;border-top:1px solid #cbdff5;color:#4b6580;font-size:12px;letter-spacing:1px}.connection-strip>span:last-child{color:var(--accent)}
main,footer{width:min(1280px,calc(100% - 80px));margin:auto}.installation{padding:76px 0 80px;scroll-margin-top:24px}.install-intro{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:46px;gap:30px}.section-kicker{color:var(--muted);font-size:10px;margin-bottom:16px;letter-spacing:2px}h2{font-size:38px;line-height:1.4;font-weight:650;letter-spacing:-1px}.install-intro>p{font-size:16px;color:var(--muted);line-height:1.9;padding-bottom:5px}.installer-layout{display:grid;grid-template-columns:300px minmax(0,1fr);gap:60px}.setup-picker fieldset{padding:0;border:0;margin:0;min-width:0}.setup-picker legend,.workspace-label{font-family:"Noto Sans Thai",sans-serif;font-size:12px;font-weight:600;letter-spacing:.3px;margin-bottom:20px}.setup-choice{position:relative;display:block;cursor:pointer;margin-bottom:10px}.setup-choice input{position:absolute;opacity:0;width:1px;height:1px}.choice-content{display:flex;align-items:center;gap:16px;padding:19px 18px;border:1px solid var(--line);transition:background .15s}.choice-symbol{font-family:system-ui,sans-serif;font-size:22px;width:34px;font-weight:600}.choice-content strong{font:600 16px/1.5 system-ui,sans-serif;display:block}.choice-content small{font:12px/1.8 system-ui,sans-serif;color:var(--muted)}.choice-arrow{margin-left:auto}.setup-choice input:checked+.choice-content{background:var(--dark);color:#fff;border-color:var(--dark);box-shadow:inset 4px 0 #79bcff}.setup-choice input:checked+.choice-content small,.setup-choice input:checked+.choice-content .choice-symbol,.setup-choice input:checked+.choice-content .choice-arrow{color:#c3e2ff}.setup-choice input:focus-visible+.choice-content{outline:3px solid #3182ce;outline-offset:3px}.setup-choice:hover .choice-content{border-color:#3182ce}.download-kit{display:flex;align-items:center;justify-content:space-between;gap:15px;border-top:1px solid var(--line);padding:24px 0 16px;margin-top:25px;text-decoration:none;font-size:12px;color:var(--muted)}.download-kit strong{display:block;margin-top:5px;color:var(--ink);font-size:15px;text-decoration:underline;text-underline-offset:4px}.download-kit>span:last-child{font-size:24px;color:var(--ink)}.compatibility{font-size:12px;line-height:1.9;color:var(--muted)}.setup-workspace{min-width:0}.setup-panel{background:#fff;border:1px solid var(--line);padding:24px 32px 28px}.setup-panel+.setup-panel{margin-top:20px}.setup-topline{display:flex;justify-content:space-between;gap:12px;color:var(--muted);font-size:10px;letter-spacing:.6px;border-bottom:1px solid var(--line);padding-bottom:16px;margin-bottom:22px}.setup-panel h3{font:600 30px/1.35 system-ui,sans-serif;letter-spacing:-1px}.setup-panel h3>span{font-size:16px;font-weight:400;letter-spacing:0;color:var(--muted);margin-left:10px}.setup-description{font-size:14px;line-height:1.85;color:var(--muted);margin-top:12px}.command-console{background:var(--dark);color:#c3e2ff;margin:24px 0 6px;padding:16px 20px}.console-bar{display:flex;justify-content:space-between;align-items:center;gap:12px;font-size:10px;color:#c3dbf3}.console-bar button{color:#dfedff;background:transparent;border:1px solid #719bc4;padding:7px 12px;cursor:pointer;font-size:12px;white-space:nowrap}.console-bar button:hover{background:#245486}.console-bar button span{margin-left:10px}.command-console code{display:block;font:13px/1.9 ui-monospace,Consolas,monospace;overflow-wrap:anywhere;margin-top:18px;white-space:pre-wrap}.copy-status{font-size:12px;line-height:1.7;min-height:20px;margin-top:8px;color:#dfedff}.setup-steps{list-style:none;padding:0;margin:0}.setup-steps li{display:flex;gap:20px;padding:24px 0;border-bottom:1px solid #e5eef8}.step-number{font:14px/1.9 ui-monospace,monospace;color:#2369ad}.setup-steps h4{font-size:16px;font-weight:600;line-height:1.8}.setup-steps p,.setup-note{font-size:13px;line-height:1.9;color:var(--muted);overflow-wrap:anywhere}.setup-steps p{margin-top:7px}.setup-note{border-left:2px solid #3182ce;padding-left:14px;margin-top:22px}.plugin-status{font-size:12px;line-height:1.8;color:#315a83;border:1px solid #c6dbf2;padding:12px 16px;margin-bottom:30px}
.after-install{display:grid;grid-template-columns:1fr 1.5fr;gap:65px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:54px 0}.after-install ol{padding:0;list-style:none;margin:0}.after-install li{display:flex;gap:22px;padding:0 0 26px}.after-install li:last-child{padding-bottom:0}.after-install li>span{font:12px/1.8 ui-monospace,monospace;background:#dfedff;width:34px;height:34px;display:grid;place-items:center;flex-shrink:0}.after-install h3{font-size:17px;font-weight:600}.after-install p{font-size:14px;color:var(--muted);margin-top:6px;line-height:1.9}.after-install .section-kicker{font-size:10px;margin:0 0 16px}.plugin-help{display:grid;grid-template-columns:1fr 1.5fr;gap:65px;padding:55px 0 70px}.plugin-help h2{font-size:25px}.plugin-help details{border-bottom:1px solid var(--line);padding:0 0 20px;margin-bottom:20px}.plugin-help summary{font-size:16px;cursor:pointer;line-height:1.8}.plugin-help details p{font-size:14px;color:var(--muted);line-height:1.9;margin-top:15px;overflow-wrap:anywhere}footer{border-top:1px solid var(--line);padding:28px 0 36px;display:flex;align-items:center;justify-content:space-between;gap:25px}footer>strong{font:650 17px system-ui,sans-serif;white-space:nowrap}footer>strong span{font-weight:400}footer p,footer>a{font-size:10px;line-height:1.9;color:var(--muted)}
@media(max-width:1400px){.plugin-hero,.connection-strip{margin-left:40px;margin-right:40px}.plugin-hero{gap:45px}.installer-layout{grid-template-columns:280px minmax(0,1fr);gap:40px}}
@media(max-width:1050px){.plugin-hero{gap:32px;padding:55px 0}.hero-statement{font-size:23px}.eyebrow{font-size:8px;letter-spacing:1px}.installer-layout{grid-template-columns:230px minmax(0,1fr);gap:26px}.setup-panel{padding:22px}.choice-content{gap:10px;padding:18px 12px}.public-header .public-header-nav{border-color:#cbdff5}.after-install,.plugin-help{gap:35px}.study-label{font-size:8px}}
@media(max-width:760px){main,footer{width:calc(100% - 40px)}body>header.public-header{width:100%;margin:0;padding:8px 20px;top:0}.plugin-hero,.connection-strip{margin-left:20px;margin-right:20px}.plugin-hero{grid-template-columns:1fr;padding:42px 0 40px;gap:38px}.eyebrow{font-size:8px}h1{font-size:56px;letter-spacing:-2.5px;margin:22px 0}h1>span{display:inline}.hero-statement{font-size:25px}.hero-description{font-size:14px}.hero-action{margin-top:24px}.vector-study{max-width:450px;width:calc(100% - 12px);margin:0 auto;transform:rotate(-1.5deg);padding:14px}.vector-study svg{max-height:290px}.study-label{font-size:9px}.connection-strip{font-size:8px;letter-spacing:.2px;gap:8px;padding:20px 0}.installation{padding:44px 0}.install-intro{display:block;margin-bottom:30px}h2{font-size:31px}.install-intro>p{font-size:14px;margin-top:16px}.installer-layout{grid-template-columns:1fr;gap:30px}.setup-picker fieldset{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.setup-picker legend{margin-bottom:15px}.setup-choice{margin:0}.choice-content{height:116px;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:8px;padding:12px 9px}.choice-content strong{font-size:12px}.choice-content small{font-size:11px}.choice-symbol{font-size:20px;line-height:1}.choice-arrow{display:none}.download-kit{margin-top:20px;padding:16px 0}.compatibility{font-size:11px}.workspace-label{margin-bottom:15px}.setup-panel{padding:20px 18px}.setup-panel h3{font-size:25px}.setup-panel h3>span{font-size:14px;margin-left:6px}.setup-topline{font-size:9px}.setup-description{font-size:13px}.command-console{padding:13px;margin-top:20px}.command-console code{font-size:12px}.console-bar{font-size:9px;letter-spacing:1px}.console-bar button{font-size:11px;padding:7px 9px}.setup-steps li{gap:12px;padding:20px 0}.setup-steps h4{font-size:15px}.setup-steps p,.setup-note{font-size:12px}.after-install,.plugin-help{grid-template-columns:1fr;gap:28px;padding:35px 0}.after-install h2 br{display:none}.after-install li{gap:16px}.plugin-help h2{font-size:24px}footer{flex-wrap:wrap;gap:16px}footer p{order:3;width:100%;font-size:10px}.plugin-status{font-size:11px;padding:10px 12px}.section-kicker{font-size:9px}}
@media(max-width:380px){h1{font-size:47px}.choice-content strong{font-size:10px}.choice-content{padding:10px 7px}.setup-panel{padding:18px 13px}.connection-strip{font-size:7px}.console-bar{letter-spacing:.2px}.public-header .public-header-start{font-size:11px;padding:8px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}

/* Rounded surfaces and gentle motion, matching the About page. */
body.plugin-page>header.public-header{width:min(1160px,calc(100% - 64px));margin:24px auto 0;padding:6px 18px;top:12px;border:1px solid #d1e2f4;border-radius:18px;background:#fff}
.plugin-page .public-header .public-header-start,.hero-action,.console-bar button{border-radius:10px}
.vector-study,.setup-panel{border-radius:18px;box-shadow:0 8px 28px #2539570d}
.vector-study svg{border-radius:12px}
.choice-content,.command-console,.plugin-status{border-radius:14px}
.after-install li>span{border-radius:10px}
.eyebrow>span{border-radius:50%}
.download-kit{border:1px solid var(--line);border-radius:14px;padding:18px;background:#fff}
.plugin-help details{border:1px solid var(--line);border-radius:14px;padding:18px 20px;background:#fff}
.hero-action,.console-bar button,.choice-content,.download-kit,.public-header-start{transition:background .2s,box-shadow .2s,transform .2s,border-color .2s}
@media(hover:hover) and (prefers-reduced-motion:no-preference){.hero-action:hover,.console-bar button:hover,.download-kit:hover{transform:translateY(-2px);box-shadow:0 7px 18px #216bc427}.setup-choice:hover .choice-content{transform:translateY(-2px);box-shadow:0 8px 24px #25395712}}
@media(min-width:1500px){body.plugin-page>header.public-header{width:min(1240px,calc(100% - 80px))}}
@media(max-width:760px){body.plugin-page>header.public-header{width:calc(100% - 36px);margin-top:14px;top:8px;border-radius:14px}.download-kit{padding:16px}.setup-panel{border-radius:16px}}
@media(prefers-reduced-motion:reduce){.plugin-page *{transition:none!important}}
