:root{--bg:#111511;--panel:#1b211b;--text:#f4f7f4;--muted:#aab4aa;--accent:#9ac790;--accent-two:#d8f06b;--border:#343e34}
html{scroll-behavior:smooth}body{min-width:320px;background:radial-gradient(circle at 10% 4%,rgba(154,199,144,.12),transparent 30rem),radial-gradient(circle at 90% 30%,rgba(216,240,107,.06),transparent 30rem),var(--bg)}
a:focus-visible{outline:3px solid var(--accent-two);outline-offset:4px;border-radius:5px}.skip-link{position:fixed;left:1rem;top:1rem;z-index:100;padding:.8rem 1rem;background:#fff;color:#111;transform:translateY(-180%)}.skip-link:focus{transform:none}
.site-frame{width:min(1160px,calc(100% - 48px));margin:auto}.site-header{min-height:86px;display:flex;align-items:center;justify-content:space-between;gap:2rem;border-bottom:1px solid var(--border)}
.brand{display:inline-flex;align-items:center;gap:.8rem;text-decoration:none;font-weight:650;letter-spacing:-.02em}.brand strong{color:var(--accent)}.brand-mark{display:grid;width:42px;height:42px;place-items:center;border-radius:13px;background:linear-gradient(135deg,var(--accent),var(--accent-two));color:#111511;font-size:.74rem;font-weight:900;letter-spacing:.08em}
.primary-nav{display:flex;align-items:center;gap:1.3rem}.primary-nav a{color:var(--muted);font-size:.87rem;text-decoration:none}.primary-nav a:hover{color:var(--text)}.primary-nav .nav-home{padding:.65rem 1rem;border:1px solid var(--border);border-radius:999px;color:var(--text)}
.eyebrow{margin:0 0 1rem;color:var(--accent-two);font-size:.72rem;font-weight:850;letter-spacing:.16em;text-transform:uppercase}.hero{padding:clamp(5rem,10vw,9rem) 0 5rem;text-align:center}.hero h1{margin:0;font-size:clamp(4rem,8vw,7.5rem);line-height:1.02;letter-spacing:-.075em}.hero h1 span{color:transparent;-webkit-text-stroke:1px rgba(216,240,107,.66)}
.hero>p:not(.eyebrow){max-width:760px;margin:2.4rem auto 0;color:var(--muted);font-size:clamp(1.05rem,2vw,1.24rem)}.hero-actions{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:1.3rem;margin-top:2.2rem}.primary-button{display:inline-flex;min-height:52px;align-items:center;padding:.8rem 1.3rem;border-radius:12px;background:linear-gradient(135deg,var(--accent),var(--accent-two));color:#111511;font-weight:850;text-decoration:none}.text-link{font-weight:750;text-decoration:none}
.hero-facts{display:grid;grid-template-columns:repeat(3,1fr);max-width:760px;margin:5rem auto 0;border:1px solid var(--border);border-radius:20px;overflow:hidden;background:rgba(27,33,27,.58)}.hero-facts div{padding:1.3rem;border-right:1px solid var(--border)}.hero-facts div:last-child{border:0}.hero-facts strong,.hero-facts span{display:block}.hero-facts strong{font-size:1.2rem}.hero-facts span{margin-top:.2rem;color:var(--muted);font-size:.76rem}
.tools-section,.about-section,.privacy-section,.faq-section,.network-strip{padding:7rem 0;border-top:1px solid var(--border)}.section-heading{display:grid;grid-template-columns:1.1fr .9fr;gap:4rem;align-items:end;margin-bottom:3rem}.section-heading h2,.privacy-section h2,.faq-section h2,.network-strip h2{margin:0;font-size:clamp(2.7rem,5.5vw,5.2rem);line-height:.95;letter-spacing:-.06em}.section-heading>p{max-width:500px;margin:0;color:var(--muted)}
.tool-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1rem}.tool-card{--tool-accent:var(--accent);position:relative;overflow:hidden;min-height:650px;display:flex;flex-direction:column;padding:2rem;border:1px solid var(--border);border-radius:26px;background:linear-gradient(150deg,rgba(255,255,255,.055),rgba(255,255,255,.015))}.tool-card.reader{--tool-accent:#a6b5ff}.tool-card.aspect{--tool-accent:#8f8cff}.tool-card:after{content:"";position:absolute;width:260px;height:260px;right:-100px;top:-120px;border-radius:50%;background:var(--tool-accent);filter:blur(90px);opacity:.15}.tool-topline{position:relative;display:flex;justify-content:space-between;align-items:center}.tool-icon{display:grid;width:56px;height:56px;place-items:center;border-radius:16px;background:color-mix(in srgb,var(--tool-accent) 16%,transparent);color:var(--tool-accent);font-size:.74rem;font-weight:900}.status{padding:.35rem .65rem;border:1px solid var(--border);border-radius:999px;color:var(--muted);font-size:.7rem}
.tool-card h3{position:relative;margin:5rem 0 .7rem;font-size:clamp(2.5rem,5vw,4.5rem);line-height:.95;letter-spacing:-.06em}.tool-lead{max-width:520px;margin:0;color:var(--muted);font-size:1.02rem}.feature-list{margin:2rem 0;padding:1.5rem 0 0;list-style:none;border-top:1px solid var(--border)}.feature-list li{position:relative;padding:.42rem 0 .42rem 1.3rem;color:#c7cec7}.feature-list li:before{content:"";position:absolute;left:0;top:1em;width:6px;height:6px;border-radius:50%;background:var(--tool-accent)}
.best-for{margin-top:auto;padding:1.1rem;border-radius:14px;background:rgba(0,0,0,.16)}.best-for strong,.best-for span{display:block}.best-for strong{color:var(--tool-accent);font-size:.7rem;letter-spacing:.1em;text-transform:uppercase}.best-for span{margin-top:.35rem;color:var(--muted);font-size:.84rem}.launch-button{display:flex;justify-content:space-between;align-items:center;min-height:54px;margin-top:1rem;padding:.8rem 1rem;border-radius:12px;background:var(--tool-accent);color:#111511;font-weight:900;text-decoration:none}
.principle-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--border)}.principle-grid article{padding:1.6rem;background:var(--bg)}.principle-grid span{color:var(--accent-two);font:700 .7rem ui-monospace,monospace}.principle-grid h3{margin:2.5rem 0 .5rem;font-size:1.15rem}.principle-grid p{margin:0;color:var(--muted);font-size:.9rem}
.privacy-section{display:grid;grid-template-columns:140px 1fr;gap:3rem;align-items:start}.privacy-mark{display:grid;aspect-ratio:1;place-items:center;border:1px solid var(--border);border-radius:32px;background:rgba(154,199,144,.08);color:var(--accent);font-size:4rem}.privacy-section p:not(.eyebrow){max-width:780px;color:var(--muted)}.privacy-section a{color:var(--accent-two);font-weight:800;text-decoration:none}
.faq-section{display:grid;grid-template-columns:.75fr 1.25fr;gap:5rem}.faq-list{border-top:1px solid var(--border)}.faq-list details{border-bottom:1px solid var(--border);padding:1.3rem 0}.faq-list summary{cursor:pointer;font-weight:800}.faq-list p{color:var(--muted)}.faq-list a{color:var(--text)}
.network-strip{display:grid;grid-template-columns:1fr 1fr;gap:4rem}.network-strip nav{display:grid;grid-template-columns:1fr 1fr;gap:.7rem}.network-strip nav a{display:flex;justify-content:space-between;padding:1rem;border:1px solid var(--border);border-radius:12px;text-decoration:none}.network-strip nav a:hover{border-color:var(--accent)}
.site-footer{display:flex;justify-content:space-between;gap:2rem;padding:2rem 0 4rem;border-top:1px solid var(--border);color:var(--muted);font-size:.85rem}.site-footer p{margin:0}.site-footer nav{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:1rem}
@media(max-width:880px){.tool-grid{grid-template-columns:1fr}.principle-grid{grid-template-columns:1fr 1fr}.faq-section,.network-strip{grid-template-columns:1fr}.tool-card{min-height:580px}}
@media(max-width:680px){.site-frame{width:min(100% - 28px,1160px)}.site-header{min-height:74px}.primary-nav a:not(.nav-home){display:none}.nav-home{font-size:0!important}.nav-home span{font-size:1rem}.hero h1{font-size:clamp(3.7rem,19vw,6rem)}.hero-facts{grid-template-columns:1fr}.hero-facts div{border-right:0;border-bottom:1px solid var(--border)}.section-heading{grid-template-columns:1fr;gap:1rem}.tool-card{min-height:0;padding:1.3rem}.tool-card h3{margin-top:3.5rem}.principle-grid{grid-template-columns:1fr}.privacy-section{grid-template-columns:1fr}.privacy-mark{width:100px}.network-strip nav{grid-template-columns:1fr}.site-footer{flex-direction:column}.site-footer nav{justify-content:flex-start}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition:none!important}}
.hero{padding-top:clamp(3rem,7vw,6rem);padding-bottom:clamp(2.5rem,6vw,4.5rem)}
.feature-list,.about-section{display:none}
.tools-section,.privacy-section,.faq-section,.network-strip{padding-top:clamp(2.5rem,5vw,4rem);padding-bottom:clamp(2.5rem,5vw,4rem)}

/* Keep the rotating outer labels inside the Tools hero's clipped paint area.
   The shared desktop orbit can sit close enough to this hub's narrow frame for
   a long label to cross the right edge during part of its rotation. */
@media(min-width:1181px){body.do-hub-polish[data-do-site="tools"] .hero.do-domain-orbit-host>.do-domain-orbit{right:clamp(58px,4vw,76px);width:clamp(410px,35vw,460px)}}

/* Reserve a real label-safe gutter on narrow phones. The shared orbit size
   leaves enough room for its rings, but Tools' longer Education label extends
   beyond the circle and could meet the viewport edge in mobile Safari. */
@media(max-width:480px){body.do-hub-polish[data-do-site="tools"] .hero.do-domain-orbit-host>.do-domain-orbit{width:min(calc(100% - 64px),360px)}}

/* Catalog-backed tool discovery pages. The application workspaces keep their
   own established UI; this layer mirrors the shared Generator detail contract. */
.hub-shell{width:min(1280px,calc(100% - 48px));margin:0 auto}
.detail-page{max-width:none;min-height:0;padding:clamp(20px,3vw,36px) 0 0}
.detail-hero{position:relative;overflow:hidden;padding:clamp(28px,5vw,62px);border:1px solid #385540;border-radius:28px;background:linear-gradient(135deg,rgba(154,199,144,.17),rgba(17,21,17,.98) 52%,rgba(17,21,17,.92));box-shadow:0 24px 70px rgba(0,0,0,.2)}
.detail-hero::after{content:"";position:absolute;z-index:0;width:260px;aspect-ratio:1;right:-80px;top:-110px;border-radius:50%;background:radial-gradient(circle,rgba(216,240,107,.18),transparent 68%);pointer-events:none}
.detail-hero>*{position:relative;z-index:1}
.breadcrumbs{display:flex;flex-wrap:wrap;gap:.45rem;align-items:center;color:var(--muted);font-size:.9rem}
.detail-hero .breadcrumbs{width:fit-content;margin:0 0 clamp(30px,4vw,46px);padding:7px 11px;border:1px solid rgba(154,199,144,.34);border-radius:999px;background:rgba(10,15,12,.68);box-shadow:0 10px 28px rgba(0,0,0,.18)}
.breadcrumbs a{display:inline-flex;min-height:32px;align-items:center;gap:.45rem;padding:0 5px;border-radius:999px;color:#d8e7d8;font-weight:720;text-decoration:none;transition:background-color .18s ease,color .18s ease}
.breadcrumbs a:is(:hover,:focus-visible){background:rgba(154,199,144,.12);color:#fff}
.breadcrumb-mark{display:inline-flex;width:27px;height:27px;align-items:center;justify-content:center;border-radius:9px;background:linear-gradient(135deg,#74dff1,#9ac790);color:#0c1018;font-size:.67rem;font-weight:900;letter-spacing:.02em}
.breadcrumb-separator{color:#86a58a;font-size:1.15rem}
.detail-hero h1{max-width:940px;margin:12px 0 20px;font-size:clamp(3rem,7vw,6.6rem);line-height:.96;letter-spacing:-.055em;overflow-wrap:anywhere}
.detail-lead{max-width:840px;margin:0;color:#bdc8bd;font-size:clamp(1.05rem,2vw,1.3rem);line-height:1.65}
.detail-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:30px}
.detail-actions>a{display:inline-flex;min-height:52px;align-items:center;justify-content:center;padding:11px 18px;border-radius:13px;font-weight:850;text-decoration:none}
.secondary-button{border:1px solid #435143;color:#e2e9e2;background:rgba(0,0,0,.13)}
.detail-info-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-top:16px}
.detail-page .detail-info-grid>section,.detail-page .detail-privacy,.detail-page .detail-related{padding:clamp(24px,4vw,38px);border:1px solid var(--border);border-radius:20px;background:linear-gradient(145deg,rgba(154,199,144,.07),var(--panel) 42%);color:#bdc8bd;line-height:1.7}
.detail-page .detail-info-grid>section{min-height:100%}
.detail-page .detail-info-grid h2,.detail-page .detail-privacy h2,.detail-page .detail-related h2{margin:8px 0 18px;font-size:clamp(1.35rem,2.6vw,2rem);line-height:1.15;letter-spacing:-.025em;color:var(--text)}
.detail-section-label{margin:0;color:var(--accent-two);font-size:.72rem;font-weight:850;letter-spacing:.14em;text-transform:uppercase}
.detail-feature-list,.detail-info-grid ol{padding-left:1.25rem}
.detail-feature-list li,.detail-info-grid li{margin:.42rem 0}
.detail-privacy,.detail-related{margin-top:16px}
.detail-privacy a{color:var(--accent-two);font-weight:800}
.related-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.related-card{display:flex;flex-direction:column;justify-content:center;gap:3px;min-height:76px;padding:16px 18px;border:1px solid #3c4c3c;border-radius:14px;background:#101610;color:#e1eae1;text-decoration:none}
.related-card span{color:var(--muted);font-size:.8rem}
.related-card:hover{border-color:var(--accent);transform:translateY(-2px)}
.detail-support{margin-top:16px}
.do-detail-footer-v6{position:relative;left:50%;box-sizing:border-box;width:100dvw;margin:22px 0 0;transform:translateX(-50%);border-top:1px solid #385540;background:linear-gradient(180deg,#151d17,#0d120e);box-shadow:0 -12px 38px rgba(0,0,0,.16);color:var(--muted)}
.do-detail-footer-inner{display:grid;grid-template-columns:minmax(220px,.75fr) minmax(0,1.25fr);align-items:center;gap:24px 48px;width:min(1280px,calc(100% - 40px));margin:0 auto;padding:clamp(28px,4vw,44px) 0}
.do-detail-footer-brand{display:grid;gap:3px;min-width:0}.do-detail-footer-brand strong{color:var(--text);font-size:.98rem}.do-detail-footer-brand>span{color:var(--accent-two);font-size:.79rem;font-weight:760;letter-spacing:.08em;text-transform:uppercase}.do-detail-footer-brand small{margin-top:7px;color:var(--muted);font-size:.78rem}
.do-detail-footer-actions{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:22px}.do-detail-footer-actions a{display:inline-flex;min-height:44px;align-items:center;padding:0;border-bottom:1px solid transparent;text-decoration:none}.do-detail-footer-link--privacy{color:#b9d8ff}.do-detail-footer-link--contact{color:#ffc1aa}.do-detail-footer-actions a:is(:hover,:focus-visible){border-bottom-color:currentColor;color:#fff}
.do-detail-footer-actions .do-consent-settings{display:inline-flex;min-height:56px;align-items:center;padding:0 18px;border:1px solid #aeb7c6;border-radius:16px;background:transparent;color:#c5cad4;font:inherit;font-weight:750;cursor:pointer}
@media(max-width:780px){.detail-info-grid,.related-grid{grid-template-columns:1fr}.hub-shell{width:min(100% - 28px,1280px)}}
@media(max-width:640px){.detail-hero{padding:24px 20px;border-radius:20px}.detail-hero .breadcrumbs{margin-bottom:36px}.detail-hero h1{font-size:clamp(2.7rem,14vw,4.5rem)}.detail-actions>a{width:100%}.do-detail-footer-inner{grid-template-columns:1fr;gap:20px;width:min(100% - 32px,1280px)}.do-detail-footer-actions{justify-content:flex-start}}
.tool-card.aspect,.tool-card.aspect-studio{--tool-accent:#8f8cff}