@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700;800&family=Space+Grotesk:wght@400;500;600;700&display=swap');
:root{font-family:Manrope,Arial,sans-serif;color:#23332d;background:#f7faf8;font-synthesis:none;--accent:#227c5c;--soft:#e5f3eb;--line:#dae5de;--muted:#718077;--paper:#fff;--ink:#23332d}
*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit}button,a,input,select{-webkit-tap-highlight-color:transparent}button,a{touch-action:manipulation}button{cursor:pointer}a{color:inherit;text-decoration:none}button:disabled{cursor:not-allowed;opacity:.45}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid var(--accent);outline-offset:5px}::selection{background:var(--accent);color:white}svg{width:24px;height:24px;flex-shrink:0}button svg{width:19px;height:19px}.shell{max-width:1180px;margin:auto;padding:0 40px}.nav{height:100px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);gap:20px}.logo{display:flex;align-items:center;gap:10px;font-family:'Space Grotesk',Manrope,sans-serif;font-size:27px;font-weight:700;letter-spacing:-1px}.logo-mark{background:var(--accent);color:white;width:36px;height:36px;border-radius:11px;display:grid;place-items:center;transform:rotate(-7deg)}.nav-right{display:flex;align-items:center;gap:30px;font-size:12px;font-weight:700}.quiet{color:var(--muted)}.pill{display:inline-flex;gap:8px;align-items:center;border:1px solid var(--line);border-radius:30px;padding:8px 13px;font-size:11px;font-weight:700;background:var(--paper)}.dot{width:6px;height:6px;background:var(--accent);border-radius:50%}.eyebrow{font-size:10px;letter-spacing:2px;font-weight:800;text-transform:uppercase;color:var(--accent);display:flex;align-items:center;gap:10px}.eyebrow:before{content:'';width:23px;height:1px;background:currentColor}h1{font-size:64px;line-height:1.09;letter-spacing:-3.6px;font-weight:800;margin:22px 0}h1 em{color:var(--accent);font-style:normal}h2{letter-spacing:-1px;font-size:26px;margin:0 0 14px}h3{font-size:14px;margin:0 0 8px}p{line-height:1.8;margin:0;color:var(--muted);font-size:14px}.hero{padding:68px 0 46px}.hero.center{text-align:center;max-width:720px;margin:auto;padding-bottom:34px}.center .eyebrow{justify-content:center}.center h1{font-size:58px}.center p{max-width:470px;margin:auto}.split{display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:center;padding:70px 0}.intro p{max-width:390px}.tiny{font-size:11px;color:var(--muted)}.trust{display:flex;gap:22px;margin-top:28px;font-size:11px;color:var(--muted)}.trust span{display:flex;align-items:center;gap:6px}.trust svg{width:14px;height:14px;color:var(--accent)}.panel{background:var(--paper);border:1px solid var(--line);border-radius:23px;padding:28px;box-shadow:0 12px 45px #23332d05}.panel-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:22px}.panel-head h3{margin:0}.number{font-family:'Space Grotesk',sans-serif;color:var(--accent);font-size:11px}.drop{background:var(--soft);border:1.5px dashed #a4c5b2;border-radius:15px;min-height:200px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;text-align:center;padding:24px;cursor:pointer;width:100%;color:var(--ink)}.drop.drag{outline:3px solid var(--accent)}.upload-icon{width:49px;height:49px;background:white;border-radius:14px;display:grid;place-items:center;color:var(--accent);box-shadow:0 4px 10px #00000005}.drop strong{font-size:13px}.drop small{font-size:10px;color:var(--muted)}.fields{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin:24px 0}.field{display:flex;flex-direction:column;gap:9px;font-size:11px;font-weight:700}select,input[type=text],input[type=url],input[type=number]{border:1px solid var(--line);border-radius:9px;background:var(--paper);color:var(--ink);padding:12px;width:100%;min-width:0}input[type=range]{accent-color:var(--accent);width:100%}.btn{border:0;border-radius:10px;background:var(--accent);color:white;display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:14px 20px;font-size:12px;font-weight:800;transition:transform .2s,filter .2s}.btn:hover{filter:brightness(1.08);transform:translateY(-2px)}.btn.full{width:100%}.btn.secondary{background:var(--soft);color:var(--accent)}.btn.ghost{background:transparent;border:1px solid var(--line);color:var(--ink)}.status{font-size:11px;line-height:1.7;color:var(--muted);margin-top:13px;overflow-wrap:anywhere}.status.error{color:#c14f43}.features{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line);padding:33px 0 45px;gap:40px}.feature{display:flex;gap:16px}.feature>svg{color:var(--accent);width:22px}.feature p{font-size:11px}.footer{display:flex;justify-content:space-between;gap:18px;padding:23px 0;border-top:1px solid var(--line);font-size:10px;color:var(--muted)}.preview-image{max-width:100%;max-height:115px;object-fit:contain;border-radius:8px}.hidden,[hidden]{display:none!important}.file-input{position:absolute;width:1px;height:1px;opacity:0;overflow:hidden}.info-section{padding:36px 0 60px}.info-section p{max-width:700px}.clip-orbit{position:absolute;width:440px;height:440px;border:1px solid #dce5fa;border-radius:50%;left:50%;top:90px;transform:translateX(-50%);z-index:-1}.clip-orbit:after{content:'';position:absolute;inset:38px;border:1px solid #dce5fa;border-radius:50%}body[data-app=clip]{--accent:#4268df;--soft:#edf2ff;--line:#dde4f2;--ink:#202e50;--muted:#788298;background:#f8faff;color:var(--ink)}.clip-main{position:relative;isolation:isolate}.clip-main .hero{padding-top:54px}.clip-panel{max-width:780px;margin:0 auto 48px}.url-row{display:flex;gap:10px}.url-row input{padding:17px}.url-row .btn{flex-shrink:0}.label-row{display:flex;gap:8px;flex-wrap:wrap;margin-top:18px}.label-row span{font-size:10px;background:var(--soft);padding:6px 10px;border-radius:6px;color:var(--accent)}.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:30px;margin:0 auto 40px;max-width:780px}.step-no{font:12px 'Space Grotesk',sans-serif;color:var(--accent);margin-bottom:12px}.steps p{font-size:11px}video{width:100%;max-height:290px;background:#141b2a;border-radius:12px;margin-top:20px}.video-actions{display:flex;gap:12px;margin-top:14px;flex-wrap:wrap}.notice{background:var(--soft);border-radius:9px;padding:13px;font-size:11px;line-height:1.7;margin-top:20px;color:var(--muted)}body[data-app=tempo]{--accent:#ba664b;--soft:#f2e8dd;--line:#e7ded2;--muted:#958575;--ink:#4b3d33;--paper:#fffcf7;background:#f8f3eb;color:var(--ink)}body[data-app=tempo] h1{font-family:Georgia,serif;font-weight:400;letter-spacing:-2px;font-size:76px}.tempo-layout{gap:90px}.tempo-card{text-align:center;padding:27px 36px}.tabs{display:flex;background:var(--soft);padding:5px;border-radius:10px;gap:3px}.tab{flex:1;border:0;background:transparent;color:var(--muted);border-radius:7px;padding:10px 6px;font-size:10px;font-weight:700}.tab.active{background:var(--paper);color:var(--accent);box-shadow:0 2px 8px #00000007}.timer-ring{width:260px;height:260px;margin:28px auto;border-radius:50%;background:conic-gradient(var(--accent) var(--progress,0%),var(--soft) 0);padding:4px}.timer-face{height:100%;border-radius:50%;background:var(--paper);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:9px}.timer-digits{font:61px 'Space Grotesk',sans-serif;letter-spacing:-3px;font-variant-numeric:tabular-nums}.timer-face small{text-transform:uppercase;font-size:9px;letter-spacing:2px;color:var(--muted)}.timer-actions{display:flex;gap:10px;justify-content:center}.timer-actions .btn:first-child{min-width:160px}.task-input{margin-top:26px;text-align:left}.sessions{margin-top:24px;display:flex;align-items:center;justify-content:center;gap:7px;font-size:10px;color:var(--muted)}.session-dot{width:8px;height:8px;border-radius:50%;background:var(--line)}.session-dot.done{background:var(--accent)}.quote{margin-top:34px;border-left:2px solid var(--accent);padding-left:17px;font-family:Georgia,serif;font-style:italic;font-size:17px;color:var(--muted)}.leaf-art{display:flex;align-items:end;gap:6px;margin-top:32px;height:70px}.leaf-art i{display:block;width:28px;background:var(--accent);border-radius:30px 0 30px 0;transform:rotate(-20deg);opacity:.35;height:50px}.leaf-art i:nth-child(2){height:70px;opacity:.6;transform:rotate(12deg)}.leaf-art i:nth-child(3){height:40px;transform:rotate(28deg)}body[data-app=pairs]{--accent:#8055c9;--soft:#eee7fb;--line:#e4ddee;--muted:#93849e;--ink:#3c2e4b;background:#f9f6fe;color:var(--ink)}.game-layout{display:grid;grid-template-columns:1fr 1.15fr;align-items:center;gap:70px;padding:60px 0}.game-layout h1{font-size:66px}.stats{display:flex;gap:34px;margin:28px 0}.stat strong{font:29px 'Space Grotesk',sans-serif;display:block;font-variant-numeric:tabular-nums}.stat span{font-size:10px;color:var(--muted)}.board{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.card{aspect-ratio:1;border:0;border-radius:15px;background:var(--soft);color:var(--accent);font:32px 'Space Grotesk',sans-serif;transition:transform .25s,background .25s;position:relative}.card:hover{transform:translateY(-3px);background:#e5d9f8}.card.flipped{background:#fff;box-shadow:inset 0 0 0 1px var(--line);transform:rotate(-2deg)}.card.matched{background:#e1f1e9;box-shadow:none;cursor:default;transform:scale(.94)}.card .back{font-size:24px;opacity:.4}.board-caption{display:flex;justify-content:space-between;margin-top:18px;font-size:10px;color:var(--muted)}.game-note{margin-top:24px;font-size:11px;max-width:300px}.difficulty{display:flex;gap:7px;margin-bottom:18px}.difficulty button{border:1px solid var(--line);border-radius:8px;padding:8px 11px;background:transparent;color:var(--muted);font-size:10px}.difficulty button.active{background:var(--soft);color:var(--accent);border-color:var(--accent)}body[data-app=snake]{--accent:#c4ee76;--soft:#253127;--line:#303c34;--muted:#8e9d92;--paper:#1b2520;--ink:#edf2e9;background:#141c18;color:var(--ink)}body[data-app=snake] .logo-mark{color:#18221a}body[data-app=snake] .btn{color:#19221b}body[data-app=snake] h1{font-family:'Space Grotesk',Manrope,sans-serif;font-size:76px;letter-spacing:-4px}body[data-app=snake] .eyebrow{font-family:'Space Grotesk',sans-serif}.snake-wrap{position:relative;border:1px solid var(--line);border-radius:17px;overflow:hidden;background:#18221b}.snake-wrap canvas{width:100%;display:block;aspect-ratio:1;touch-action:none}.game-overlay{position:absolute;inset:0;background:#142018d9;display:flex;align-items:center;justify-content:center;flex-direction:column;text-align:center;padding:24px;backdrop-filter:blur(5px);gap:16px}.game-overlay h2{font-size:28px;margin:0}.game-overlay p{font-size:12px}.controls{display:flex;justify-content:space-between;align-items:center;margin-top:14px;gap:10px}.key{border:1px solid var(--line);border-bottom-width:3px;border-radius:5px;padding:4px 7px;font-size:10px;color:var(--muted)}.dpad{display:grid;grid-template-columns:repeat(3,40px);gap:5px;justify-content:center;margin-top:16px}.dpad button{border:1px solid var(--line);border-radius:7px;background:var(--soft);color:var(--accent);height:34px}.dpad button:first-child{grid-column:2}.dpad button:nth-child(2){grid-column:1}.snake-label{display:flex;gap:8px;align-items:center;font:10px 'Space Grotesk',sans-serif;letter-spacing:1px}.snake-label .dot{box-shadow:0 0 12px var(--accent)}.home-hero{padding:65px 0 40px;display:flex;justify-content:space-between;align-items:end;gap:40px}.home-hero h1{max-width:650px;margin-bottom:0}.home-hero p{max-width:240px}.collection{display:grid;grid-template-columns:repeat(6,1fr);gap:20px;padding-bottom:60px}.site-card{grid-column:span 2;border-radius:22px;padding:27px;min-height:280px;display:flex;flex-direction:column;transition:transform .2s;position:relative;overflow:hidden}.site-card:hover{transform:translateY(-6px)}.site-card:nth-child(4),.site-card:nth-child(5){grid-column:span 3}.site-card h2{font-size:28px;margin:0}.site-card p{font-size:12px;color:inherit;opacity:.65}.site-card .card-top{display:flex;justify-content:space-between;align-items:center}.site-card .card-art{flex:1;min-height:140px;display:grid;place-items:center;font:52px 'Space Grotesk',sans-serif;letter-spacing:-3px}.card-art .fake-file{font-size:20px;letter-spacing:-1px;background:#ffffffa8;padding:20px 24px;border:1px solid #ffffff;border-radius:13px;transform:rotate(-9deg);box-shadow:10px 10px 0 #ffffff55}.site-card:nth-child(1){background:#e0f1e8;color:#276549}.site-card:nth-child(2){background:#e5ecff;color:#4268df}.site-card:nth-child(3){background:#f3e8db;color:#a3664c}.site-card:nth-child(4){background:#ece4fa;color:#8055c9}.site-card:nth-child(5){background:#1c2920;color:#c4ee76}.mini-pairs{display:flex;gap:8px}.mini-pairs span{font-size:30px;letter-spacing:0;background:#ffffff80;padding:13px;border-radius:12px;transform:rotate(-7deg)}.mini-pairs span:last-child{transform:rotate(8deg)}.pixel-snake{width:120px;height:45px;border-radius:8px;background:#c4ee76;position:relative}.pixel-snake:before{content:'';position:absolute;width:40px;height:70px;background:#c4ee76;left:0;bottom:0;border-radius:8px}.pixel-snake:after{content:'··';position:absolute;color:#1c2920;right:8px;top:-15px;transform:rotate(90deg)}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}
@media(min-width:1500px){.shell{max-width:1270px}.split,.game-layout{padding-top:100px;padding-bottom:100px}}
@media(max-width:900px){.shell{padding:0 25px}.split,.game-layout{gap:30px}h1,.game-layout h1{font-size:49px;letter-spacing:-2px}body[data-app=tempo] h1{font-size:60px}body[data-app=snake] h1{font-size:56px}.timer-ring{width:220px;height:220px}.tempo-card{padding:22px}.nav-right{gap:15px}.site-card{grid-column:span 3}.site-card:last-child{grid-column:span 6}.features{gap:20px}.feature{gap:10px}.home-hero{align-items:start;flex-direction:column;gap:20px}.home-hero p{max-width:450px}}
@media(max-width:640px){.shell{padding:0 20px}.nav{height:77px}.nav-right>a{display:none}.nav-right .pill{font-size:9px;padding:7px 9px}.logo{font-size:24px}.split,.game-layout{grid-template-columns:1fr;padding:38px 0;gap:32px}.hero{padding:40px 0 28px}h1,.center h1,.game-layout h1{font-size:45px;letter-spacing:-2px}.center h1{font-size:42px}.hero.center{padding-top:39px}.intro p{max-width:100%}.trust{gap:15px;margin-top:20px}.panel{padding:20px}.features{grid-template-columns:1fr;padding:26px 0;gap:22px}.feature p{font-size:12px}.footer{font-size:9px;line-height:1.6}.steps{gap:18px}.steps h3{font-size:12px}.url-row{flex-direction:column}.clip-panel{margin-bottom:30px}.clip-orbit{width:300px;height:300px}.quote,.leaf-art{display:none}.tempo-layout{gap:26px}.timer-ring{width:240px;height:240px}.stats{margin:22px 0;gap:32px}.game-layout .intro .game-note{margin-top:18px}.card{border-radius:12px}.board{gap:8px}.game-layout h1{margin:17px 0}.collection{grid-template-columns:1fr;gap:16px}.site-card,.site-card:nth-child(4),.site-card:nth-child(5),.site-card:last-child{grid-column:auto;min-height:260px}.home-hero{padding:40px 0 30px}.home-hero h1{font-size:46px}.home-hero p{font-size:12px}.steps{grid-template-columns:1fr;gap:18px}.steps>div{display:grid;grid-template-columns:28px 1fr;gap:0 8px}.steps p{grid-column:2}.step-no{grid-row:span 2}.board-caption{font-size:9px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{transition:none!important;scroll-behavior:auto!important}}
