:root{color-scheme:light;--page:#f7f8f5;--surface:#fff;--surface-soft:#f1f4ed;--ink:#192c27;--muted:#718079;--line:#e3e9e2;--green:#244f42;--green-deep:#163f33;--lime:#d8eda9;--editor:#fbfcfa;--shadow:0 18px 60px rgba(28,62,46,.07)}
:root[data-theme="dark"]{color-scheme:dark;--page:#101b18;--surface:#1b2924;--surface-soft:#26362e;--ink:#f0f5ee;--muted:#9aaca0;--line:#34453a;--green:#d8eda9;--green-deep:#c5e291;--lime:#244b3d;--editor:#16231e;--shadow:0 18px 60px rgba(0,0,0,.17)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--page);color:var(--ink);font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;line-height:1.5}button,textarea{font:inherit}button{cursor:pointer}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible,textarea:focus-visible{outline:3px solid #90bd67;outline-offset:3px}.site-shell{max-width:1440px;margin:auto;padding:0 52px}.site-header{height:91px;display:flex;align-items:center;gap:32px;border-bottom:1px solid var(--line)}.brand{display:inline-flex;align-items:center;gap:12px;font-size:19px;font-weight:800;letter-spacing:-.065em;white-space:nowrap}.brand-light{font-weight:500;margin-left:4px}.brand-mark{height:32px;width:32px;display:grid;place-items:center;position:relative;background:var(--green);border-radius:10px;transform:rotate(-8deg)}.brand-mark span{position:absolute;width:4px;height:19px;background:var(--page);border-radius:5px}.brand-mark span:nth-child(2){transform:rotate(60deg)}.brand-mark span:nth-child(3){transform:rotate(120deg)}.header-nav{display:flex;gap:34px;margin-left:auto;font-size:13px;font-weight:650;color:var(--muted)}.header-nav a:hover,.text-button:hover,.clear-button:hover{color:var(--ink)}.theme-toggle{width:38px;height:38px;display:grid;place-items:center;margin-left:16px;border:1px solid var(--line);border-radius:50%;background:var(--surface);color:var(--ink)}.theme-toggle svg{width:17px;height:17px}.moon-icon{display:none}:root[data-theme="dark"] .moon-icon{display:block}:root[data-theme="dark"] .sun-icon{display:none}
.hero{min-height:492px;display:grid;grid-template-columns:1fr 1fr;align-items:center;overflow:hidden;border-bottom:1px solid var(--line)}.hero-content{position:relative;z-index:1;padding:66px 0 76px}.eyebrow,.section-kicker,.panel-kicker{font-size:10px;font-weight:800;letter-spacing:.16em;color:var(--green)}.eyebrow{display:inline-flex;align-items:center;gap:9px}.eyebrow-dot{width:7px;height:7px;border-radius:50%;background:#88b273;box-shadow:0 0 0 4px rgba(136,178,115,.15)}h1,h2,h3,p{margin-top:0}.hero h1{font-size:clamp(55px,5.8vw,88px);letter-spacing:-.075em;line-height:1.07;margin:24px 0 24px;font-weight:750}.hero h1 span{color:#8da18c}.hero-content>p{max-width:470px;color:var(--muted);font-size:16px;line-height:1.85;margin-bottom:28px}.hero-link{display:inline-flex;align-items:center;gap:20px;color:var(--green);font-size:13px;font-weight:800;border-bottom:1px solid currentColor;padding-bottom:8px}.hero-link span,.about-section a span{font-size:18px;line-height:1}.hero-art{height:440px;position:relative;display:flex;align-items:center;justify-content:center}.art-orbit{position:absolute;border:1px solid var(--line);border-radius:50%;width:450px;height:450px}.art-orbit-two{width:340px;height:340px}.art-card{border-radius:16px;box-shadow:0 26px 55px rgba(17,50,37,.16)}.art-card-back{position:absolute;width:310px;height:210px;background:#d4e2c8;transform:translate(75px,-24px) rotate(11deg);padding:42px 28px}.art-line{display:block;height:10px;background:#b9cfb3;border-radius:5px;margin:0 0 16px;width:85%}.art-line.short{width:43%}.art-line.medium{width:65%}.art-card-front{position:relative;width:372px;height:260px;background:#1d4437;color:#dcebd8;transform:translate(-12px,30px) rotate(-6deg);overflow:hidden}.art-card-top{height:50px;display:flex;align-items:center;justify-content:space-between;padding:0 23px;border-bottom:1px solid rgba(255,255,255,.12);font-size:10px;letter-spacing:.12em;color:#a5c4b0}.art-dots{display:flex;gap:5px}.art-dots i{width:6px;height:6px;border-radius:50%;background:#86ab91}.art-code{display:block;padding:27px 34px;font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:16px;line-height:1.9;white-space:nowrap}.art-code i{color:#b9d27e;font-style:normal}.art-code b{color:#e6efce;font-weight:500}.art-code em{color:#9bc9b3;font-style:normal}.art-spark{position:absolute;color:#81a66e}.art-spark-one{font-size:34px;top:67px;left:70px}.art-spark-two{font-size:23px;bottom:42px;right:64px}
.tools-section{padding:94px 0 110px;scroll-margin-top:30px}.section-intro{display:flex;justify-content:space-between;align-items:end;gap:25px;margin-bottom:36px}.section-intro h2{font-size:clamp(34px,3.5vw,51px);letter-spacing:-.06em;line-height:1.13;margin:15px 0 0}.section-intro h2 span{color:#93a597}.section-intro>p{max-width:320px;margin:0 0 6px;color:var(--muted);font-size:13px;line-height:1.7}.workspace{display:grid;grid-template-columns:290px minmax(0,1fr);gap:20px}.tool-list{display:flex;flex-direction:column;gap:9px}.tool-tab{width:100%;min-height:91px;display:flex;align-items:center;text-align:left;gap:14px;padding:15px;border:1px solid var(--line);border-radius:13px;background:var(--surface);color:var(--ink);transition:border-color .2s,transform .2s,background .2s}.tool-tab:hover{transform:translateY(-2px);border-color:#b8cfba}.tool-tab.is-active{background:var(--green-deep);color:#fff;border-color:var(--green-deep);box-shadow:var(--shadow)}:root[data-theme="dark"] .tool-tab.is-active{color:#172a1e}.tool-icon{display:grid;place-items:center;flex:none;width:42px;height:42px;border:1px solid var(--line);border-radius:10px;background:var(--surface-soft);font:700 15px ui-monospace,SFMono-Regular,Consolas,monospace;color:var(--green)}.tool-tab.is-active .tool-icon{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.13);color:#d8eda9}:root[data-theme="dark"] .tool-tab.is-active .tool-icon{background:rgba(22,54,30,.12);border-color:rgba(22,54,30,.15);color:#1c3e2b}.tool-tab-copy{display:grid;gap:2px}.tool-tab-copy strong{font-size:13px}.tool-tab-copy small{font-size:11px;color:var(--muted)}.tool-tab.is-active small{color:rgba(255,255,255,.63)}:root[data-theme="dark"] .tool-tab.is-active small{color:#4b694f}.tab-arrow{font-size:17px;margin-left:auto;align-self:flex-start;color:var(--muted)}.tool-tab.is-active .tab-arrow{color:#d8eda9}:root[data-theme="dark"] .tool-tab.is-active .tab-arrow{color:#1c3e2b}.tool-list-note{margin-top:auto;padding:22px 20px;background:var(--surface-soft);border-radius:13px;display:grid;gap:7px;font-size:12px}.note-spark{font-size:22px;color:var(--green)}.tool-list-note strong{font-size:13px}.tool-list-note>span:last-child{color:var(--muted);line-height:1.6}
.tool-panel{min-width:0;background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:30px;box-shadow:var(--shadow)}.panel-heading{display:flex;justify-content:space-between;align-items:start;gap:16px;margin-bottom:27px}.panel-kicker{font-size:9px}.panel-heading h3{font-size:25px;letter-spacing:-.045em;line-height:1.2;margin:9px 0 6px}.panel-heading p{color:var(--muted);font-size:12px;margin:0}.local-badge{white-space:nowrap;font-size:10px;color:var(--green);font-weight:700;padding:7px 10px;border-radius:99px;background:var(--surface-soft)}.local-badge span{display:inline-block;width:6px;height:6px;border-radius:50%;background:#7aaf6a;margin-right:5px}.editor-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.editor-block{min-width:0}.editor-label-row{height:25px;display:flex;justify-content:space-between;align-items:flex-start}.editor-label-row label{font-size:9px;font-weight:800;letter-spacing:.14em;color:var(--muted)}.text-button,.clear-button{border:0;background:transparent;color:var(--green);font-size:11px;font-weight:750;padding:0}.editor-block textarea{display:block;width:100%;height:224px;padding:17px 18px;resize:vertical;min-height:160px;border:1px solid var(--line);border-radius:10px;background:var(--editor);color:var(--ink);font:12px/1.7 ui-monospace,SFMono-Regular,Consolas,monospace;outline-offset:2px}.editor-block textarea::placeholder{color:#9ca9a0}.panel-footer{display:flex;align-items:center;justify-content:space-between;gap:14px;min-height:63px;padding-top:21px}.actions{display:flex;align-items:center;flex-wrap:wrap;gap:11px}.primary-button,.secondary-button{height:36px;padding:0 17px;border-radius:7px;font-size:11px;font-weight:800}.primary-button{border:1px solid var(--green-deep);background:var(--green-deep);color:#fff;display:flex;align-items:center;gap:22px}:root[data-theme="dark"] .primary-button{color:#183320}.primary-button:hover{filter:brightness(1.12)}.secondary-button{border:1px solid var(--line);background:var(--surface);color:var(--ink)}.secondary-button:hover{background:var(--surface-soft)}.clear-button{color:var(--muted);padding:8px}.status-message{margin:0;color:var(--muted);font-size:11px;text-align:right}.status-message[data-state="error"]{color:#c35146}.status-message[data-state="success"]{color:#468b5b}
.about-section{display:grid;grid-template-columns:155px 1fr auto;gap:48px;align-items:center;padding:54px 0 68px;border-top:1px solid var(--line);scroll-margin-top:40px}.about-symbol{font-size:105px;line-height:1;color:#9ab18d}.about-section h2{font-size:28px;letter-spacing:-.045em;margin:12px 0}.about-section p{max-width:620px;font-size:13px;line-height:1.8;color:var(--muted);margin:0}.about-section>a{white-space:nowrap;color:var(--green);font-size:12px;font-weight:800;display:flex;gap:12px;align-items:center}.site-footer{min-height:82px;border-top:1px solid var(--line);display:flex;align-items:center;gap:24px;font-size:11px;color:var(--muted)}.footer-brand{font-size:15px;color:var(--ink);font-weight:800;letter-spacing:-.04em}.footer-dot{color:#84ac76}.site-footer>span:last-child{margin-left:auto}
@media(max-width:980px){.site-shell{padding:0 30px}.hero-art{transform:scale(.78);transform-origin:center}.hero h1{font-size:60px}.workspace{grid-template-columns:245px minmax(0,1fr)}.tool-panel{padding:23px}.editor-grid{grid-template-columns:1fr}.editor-block textarea{height:150px}.tool-list-note{margin-top:10px}.about-section{grid-template-columns:90px 1fr;gap:25px}.about-symbol{font-size:80px}.about-section>a{grid-column:2}}
@media(max-width:700px){.site-shell{padding:0 20px}.site-header{height:72px}.brand{font-size:17px}.header-nav{display:none}.theme-toggle{margin-left:auto}.hero{display:block;min-height:auto}.hero-content{padding:70px 0 20px}.hero h1{font-size:clamp(51px,12vw,73px)}.hero-content>p{font-size:14px}.hero-art{height:315px;transform:scale(.7);margin:-25px -90px}.tools-section{padding:68px 0 75px}.section-intro{display:block}.section-intro>p{margin-top:18px}.workspace{display:block}.tool-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-bottom:14px}.tool-tab{display:grid;justify-items:start;min-height:100px;padding:11px;gap:5px}.tool-icon{height:32px;width:32px;font-size:12px}.tool-tab-copy strong{font-size:11px;line-height:1.3}.tool-tab-copy small,.tab-arrow,.tool-list-note{display:none}.tool-panel{padding:20px}.panel-heading h3{font-size:21px}.local-badge{display:none}.panel-footer{align-items:start;flex-direction:column}.status-message{text-align:left}.about-section{grid-template-columns:1fr;gap:12px;padding:40px 0}.about-symbol{font-size:48px}.about-section>a{grid-column:auto}.site-footer{flex-wrap:wrap;padding:20px 0;gap:8px 14px}.site-footer>span:last-child{margin-left:auto}}
@media(max-width:420px){.hero-art{transform:scale(.58);margin:-42px -120px}.tool-tab-copy strong{font-size:10px}.editor-block textarea{height:170px}.actions{gap:8px}.primary-button,.secondary-button{padding:0 10px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.tool-tab{transition:none}}
