/* Timbo's native TBTheme palette, outlined surfaces and rounded typography.
   DESIGN_VARIANCE: 4; MOTION_INTENSITY: 2; VISUAL_DENSITY: 3. */
:root{color-scheme:light;--paper:#f7f7f7;--ink:#101010;--muted:#555;--lime:#b8e654;--green:#54c202;--blue:#dcebff;--pink:#ff9fc7;--line:2px solid var(--ink);font-family:ui-rounded,"SF Pro Rounded",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--ink);background:var(--paper);font-synthesis:none}
*{box-sizing:border-box}
body{margin:0;min-width:320px;line-height:1.55}
a{color:inherit;text-underline-offset:4px}
a,button{-webkit-tap-highlight-color:transparent}
a:focus-visible,button:focus-visible{outline:3px solid #2356b3;outline-offset:5px}
button{font:inherit}
.page{max-width:1120px;margin:auto;padding:0 36px}
.header{height:94px;display:flex;align-items:center;justify-content:space-between;border-bottom:var(--line)}
.brand{display:flex;align-items:center;gap:11px;text-decoration:none;font-size:31px;font-weight:900;letter-spacing:-1.7px}
.brand img{border:var(--line);border-radius:12px;object-fit:cover}
.languages{display:flex;padding:4px;gap:3px;border:var(--line);border-radius:12px;background:#fff}
.languages a{display:grid;place-items:center;min-width:48px;min-height:36px;border-radius:7px;font-size:13px;font-weight:800;text-decoration:none}
.languages a[aria-current]{background:var(--ink);color:#fff}
.languages a:hover:not([aria-current]){background:var(--lime)}
.hero{display:grid;grid-template-columns:1.4fr 1fr;align-items:center;gap:20px;padding:55px 0 43px}
.eyebrow{margin:0 0 21px;font-family:ui-monospace,"SFMono-Regular",Consolas,monospace;text-transform:uppercase;letter-spacing:1.6px;font-size:11px;font-weight:800}
h1,h2,h3,p{margin-top:0}
h1{margin-bottom:23px;font-size:clamp(40px,4.8vw,60px);font-weight:900;letter-spacing:-2.8px;line-height:1.08;text-wrap:balance}
.hero h1 span{background:var(--lime);box-shadow:7px 0 var(--lime),-2px 0 var(--lime);box-decoration-break:clone;-webkit-box-decoration-break:clone}
.intro{max-width:510px;margin-bottom:0;color:var(--muted);font-size:18px;line-height:1.65}
.mascot-stage{position:relative;min-height:315px;display:grid;place-items:center;isolation:isolate}
.mascot-stage::before{content:"";position:absolute;width:83%;aspect-ratio:1;background:var(--blue);border:var(--line);border-radius:50%;z-index:-1;bottom:5%;right:5%}
.mascot{display:block;width:100%;height:auto;max-width:390px;transform:rotate(-5deg)}
.greeting{position:absolute;z-index:1;right:0;top:0;background:#fff;border:var(--line);box-shadow:3px 3px var(--ink);padding:10px 17px;border-radius:13px;transform:rotate(5deg);font-size:15px;font-weight:800}
.install-heading{display:flex;align-items:baseline;justify-content:space-between;gap:30px;margin-bottom:24px}
h2{font-size:28px;font-weight:850;line-height:1.2;letter-spacing:-.9px}
.install-heading h2{margin-bottom:0}
.install-heading>p{max-width:300px;margin:0;color:var(--muted);font-size:13px;line-height:1.55}
.steps{display:grid;grid-template-columns:1fr 1fr;gap:24px;list-style:none;padding:0;margin:0}
.step{display:flex;align-items:flex-start;gap:18px;padding:28px;border:var(--line);border-radius:18px;box-shadow:5px 5px var(--ink)}
.step-first{background:#fff}
.step-second{background:var(--blue)}
.step-number{flex-shrink:0;display:grid;place-items:center;width:40px;height:40px;border:var(--line);border-radius:12px;font:900 22px ui-monospace,monospace;background:var(--lime)}
.step-second .step-number{background:var(--pink)}
.step-content{min-width:0;display:flex;flex-direction:column;align-self:stretch;align-items:flex-start}
h3{font-size:24px;line-height:1.25;letter-spacing:-.6px;margin:4px 0 14px;font-weight:850}
.step-content>p{color:#414141;font-size:15px;line-height:1.65;margin-bottom:24px}
.button{min-height:50px;display:flex;align-items:center;justify-content:center;gap:15px;padding:12px 18px;margin-top:auto;width:100%;border:var(--line);border-radius:11px;background:var(--lime);box-shadow:3px 3px var(--ink);text-decoration:none;font-size:15px;font-weight:800;line-height:1.4;transition:transform .15s,box-shadow .15s}
.button:hover:not(:disabled){transform:translate(-1px,-1px);box-shadow:4px 4px var(--ink)}
.button:active:not(:disabled){transform:translate(3px,3px);box-shadow:none}
.button:disabled{background:#f2f4f7;color:#626771;border-color:#777d87;box-shadow:none;cursor:not-allowed}
.step-content .step-note{font-size:12px;line-height:1.6;margin:14px 0 0;color:#50545a}
.help-link{margin:28px 0 44px;font-size:13px;text-align:center;color:var(--muted)}
.footer{display:flex;justify-content:space-between;gap:20px;align-items:center;border-top:var(--line);padding:25px 0 30px;font-size:12px;color:var(--muted)}
.footer p{margin:0}
.footer a{font-weight:700}
.skip-link{position:fixed;top:10px;left:10px;z-index:10;padding:12px;background:var(--lime);border:var(--line);transform:translateY(-200%)}
.skip-link:focus{transform:translateY(0)}
.policy-heading{max-width:850px;padding:35px 0 45px}
.back{display:inline-block;font-size:14px;margin-bottom:36px}
.policy-heading h1{font-size:clamp(36px,5vw,58px);overflow-wrap:anywhere}
.policy-heading .eyebrow{margin-bottom:15px}
.policy-heading .intro{max-width:650px}
.updated{font:12px ui-monospace,monospace;color:var(--muted);margin:24px 0 0}
.policy-layout{display:grid;grid-template-columns:230px minmax(0,1fr);gap:55px;padding-bottom:65px;align-items:start}
.contents{position:sticky;top:25px;display:flex;flex-direction:column;font-size:13px;gap:5px}
.contents strong{margin-bottom:12px;font-size:14px}
.contents a{display:block;padding:6px 0;text-decoration:none;color:var(--muted)}
.contents a:hover{text-decoration:underline;color:var(--ink)}
.policy-content section{margin-bottom:35px;scroll-margin-top:24px}
.policy-content section:first-child{padding:26px;background:var(--lime);border:var(--line);border-radius:16px;box-shadow:4px 4px var(--ink)}
.policy-content section:last-child{margin-bottom:0}
.policy-content h2{font-size:25px;margin-bottom:16px}
.policy-content p{font-size:16px;line-height:1.8;margin-bottom:14px;color:#343434;overflow-wrap:anywhere}
.policy-content p:last-child{margin-bottom:0}
@media(min-width:1200px){.hero{padding-top:62px;padding-bottom:48px}}
@media(max-width:800px){.page{padding:0 24px}.hero{grid-template-columns:1.25fr 1fr;padding:38px 0}h1{font-size:42px;letter-spacing:-1.9px}.mascot-stage{min-height:245px}.intro{font-size:16px}.greeting{font-size:12px;padding:8px 12px}.step{padding:22px;gap:13px;flex-direction:column}.step-content{flex:1}.install-heading{display:block}.install-heading>p{margin-top:12px;max-width:none}.policy-layout{grid-template-columns:180px minmax(0,1fr);gap:30px}}
@media(max-width:580px){.page{padding:0 22px}.header{height:78px}.brand{font-size:28px}.brand img{width:36px;height:36px}.hero{display:flex;flex-direction:column;align-items:stretch;gap:22px;padding:34px 0 30px}.eyebrow{font-size:10px;letter-spacing:1.2px;margin-bottom:18px}h1{font-size:clamp(34px,8.8vw,48px);letter-spacing:-1.9px;margin-bottom:20px}.intro{font-size:16px}.mascot-stage{width:225px;min-height:225px;align-self:center}.greeting{right:-24px;top:5px;transform:rotate(5deg)}h2{font-size:25px}.install-heading{margin-bottom:20px}.steps{grid-template-columns:1fr;gap:22px}.step{flex-direction:row;padding:22px 20px;gap:14px}.step-number{width:34px;height:34px;border-radius:10px;font-size:19px}h3{font-size:21px}.button{font-size:14px;padding:12px}.step-content>p{font-size:14px}.help-link{margin:28px 0 32px}.footer{align-items:flex-start;flex-direction:column;gap:12px;padding:22px 0}.policy-heading{padding-bottom:30px}.policy-heading h1{font-size:clamp(24px,6.8vw,32px);letter-spacing:-1px;overflow-wrap:normal}.back{margin-bottom:30px}.policy-layout{display:block;padding-bottom:40px}.contents{position:static;border:var(--line);border-radius:13px;padding:18px;margin-bottom:30px;background:#fff}.contents a{min-height:35px}.policy-content section:first-child{padding:22px}.policy-content h2{font-size:24px}.policy-content p{font-size:15px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{transition:none!important;scroll-behavior:auto!important}}
.faq{max-width:760px;margin:0 auto 48px}
.faq h2{margin-bottom:20px}
.faq details{border-bottom:1px solid #bbb}
.faq summary{cursor:pointer;padding:18px 0;font-size:16px;font-weight:750;line-height:1.5}
.faq summary:focus-visible{outline:3px solid #2356b3;outline-offset:4px}
.faq details[open] summary{padding-bottom:10px}
.faq details p{font-size:15px;color:var(--muted);line-height:1.7;margin:0 0 20px}
