@font-face{font-family:'Geist Mono';src:url('assets/fonts/GeistMono-Variable.woff2') format('woff2');font-weight:100 900;font-style:normal;font-display:swap}
:root{color-scheme:dark;--bg:#10120f;--text:#e8ebe1;--muted:#9bA393;--line:#353a30;--lime:#c4f560;--pink:#f596d6;--cyan:#8bded5;font-family:'Geist Mono',monospace;font-synthesis:none}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:24px}body{margin:0;background:var(--bg);color:var(--text)}a{color:inherit;text-decoration:none}a:hover{color:var(--lime)}button,pre{font-family:inherit}button{font:inherit}a:focus-visible,button:focus-visible{outline:2px solid var(--lime);outline-offset:5px}.shell{max-width:1440px;width:calc(100% - 112px);margin:auto;border-inline:1px solid var(--line)}header{height:92px;padding:0 36px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.wordmark{font-weight:800;font-size:24px;letter-spacing:-1px}.symbol{color:var(--lime);font-weight:400;margin-right:14px}.dot{color:var(--lime)}nav{display:flex;gap:36px;font-size:12px}.hero{min-height:584px;display:flex;flex-direction:column;position:relative;isolation:isolate;border-bottom:1px solid var(--line);overflow:hidden}#landscape{position:absolute;inset:0;width:100%;height:100%;z-index:-2}.hero:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,rgba(16,18,15,.95),rgba(16,18,15,.8) 30%,transparent 70%);z-index:-1;pointer-events:none}.hero-content{padding:58px 48px;flex:1}.eyebrow{font-size:11px;letter-spacing:1.7px;display:flex;align-items:center;gap:10px;margin:0 0 25px}.status-dot{width:6px;height:6px;display:inline-block;background:var(--lime)}h1{font-size:clamp(3rem,9.6vw,9rem);line-height:1.05;font-weight:400;letter-spacing:-.06em;margin:0 0 22px}h1 span{color:var(--lime)}.intro{font-size:20px;line-height:1.65;letter-spacing:-.5px;margin:0 0 30px}.explore{display:inline-flex;align-items:center;gap:40px;border:1px solid var(--lime);padding:15px 18px;color:var(--lime);font-size:12px;background:#151b10}.explore:hover{background:var(--lime);color:var(--bg)}.hero-meta{position:relative;display:flex;justify-content:space-between;align-items:center;gap:15px;padding:18px 36px;font-size:10px;color:var(--muted);border-top:1px solid #353a3070;background:#10120fa8}.hero-meta button{padding:4px 0;border:0;background:none;color:var(--muted);cursor:pointer;font-size:10px}.hero-meta button:hover{color:var(--lime)}.section-heading{padding:44px 36px 36px;display:flex;justify-content:space-between;align-items:flex-end;gap:24px}.section-index{color:var(--lime);font-size:11px;letter-spacing:1px}h2{font-size:22px;font-weight:400;letter-spacing:-1px;margin:16px 0 0}.section-heading p{font-size:11px;line-height:1.8;color:var(--muted);margin:0}.project-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid var(--line)}.project{--accent:var(--lime);position:relative;min-width:0;display:flex;flex-direction:column;border-right:1px solid var(--line);background:#131610;transition:background .25s}.project:last-child{border-right:0}.project.pink{--accent:var(--pink)}.project.cyan{--accent:var(--cyan)}.project:before{content:'';pointer-events:none;position:absolute;inset:0;z-index:2;opacity:0;box-shadow:inset 0 0 0 1px var(--accent);background:radial-gradient(circle 240px at var(--mx,50%) var(--my,30%),color-mix(in srgb,var(--accent) 10%,transparent),transparent);transition:opacity .25s}.project:hover:before,.project:focus-within:before{opacity:1}.window-bar{height:43px;flex-shrink:0;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 20px;color:var(--muted);font-size:10px}.window-dots{letter-spacing:4px;color:#6d7563}.visual{height:185px;flex-shrink:0;container-type:inline-size;padding:16px 20px;margin:0;position:relative;overflow:hidden;border-bottom:1px solid var(--line);background:#0e110d;display:flex;align-items:center;justify-content:center;color:var(--accent)}.visual pre{font-size:min(8px,calc((100cqw - 56px)/28));line-height:1.1;letter-spacing:.08em;opacity:.65;white-space:pre;margin:0}.ascii-row{display:block;animation:ascii-wave 8s ease-in-out infinite;animation-delay:calc(var(--row)*-.22s);animation-play-state:paused}.visual .art-label{position:absolute;bottom:12px;left:18px;color:var(--muted);font-size:9px;background:#0e110ddd;padding:3px}.screens{display:flex;align-items:center;gap:15px;transform:rotate(-8deg);animation:screen-drift 10s ease-in-out infinite;animation-play-state:paused}.screen{border:1px solid var(--accent);padding:7px;background:#161019}.screen.desktop{width:160px;height:100px}.screen.phone{width:47px;height:87px;margin-left:-27px;margin-top:40px;box-shadow:0 0 0 5px #0e110d}.screen-inner{height:100%;background:repeating-linear-gradient(0deg,transparent 0 5px,#ed91d746 5px 7px),repeating-radial-gradient(ellipse at 70% 80%,#f596d680 0 2px,transparent 3px 10px)}.project-body{padding:24px 22px 26px;display:flex;flex-direction:column;flex:1}.status{font-size:9px;letter-spacing:.4px;color:var(--accent);margin-bottom:15px}.status:before{content:'[ ';}.status:after{content:' ]'}.project h3{font-size:19px;line-height:1.4;letter-spacing:-.7px;font-weight:400;margin:0 0 13px}.project .description{font-size:12px;line-height:1.85;color:#adb4a5;margin:0 0 20px}.tags{display:flex;flex-wrap:wrap;gap:7px;margin:0;padding:0;list-style:none}.tags li{font-size:9px;border:1px solid var(--line);padding:5px 7px;color:var(--muted)}.project-tail{margin-top:auto}.actions{margin-top:20px;display:flex;flex-wrap:wrap;gap:7px;position:relative;z-index:3}.actions a,.actions button{font-size:10px;border:1px solid var(--line);background:none;padding:10px 9px;color:var(--text)}.actions a:hover{border-color:var(--accent);color:var(--accent)}.actions button:disabled{color:#858d7c;cursor:not-allowed;border-style:dashed;opacity:.65}.caption{border-top:1px solid var(--line);padding:14px 22px;font-size:9px;color:var(--muted)}.caption span{color:var(--accent);margin-right:10px}footer{border-top:1px solid var(--line);padding:35px 36px;display:flex;align-items:center;justify-content:space-between;gap:20px}.footer-sign{font-size:20px;font-weight:800}.footer-sign>span:first-child{color:var(--lime)}.author{font-size:10px;color:var(--muted);font-weight:400;margin-left:12px}footer a{font-size:11px;color:var(--muted)}.skip{position:fixed;top:-100px;padding:12px;background:var(--lime);color:#10120f;z-index:10}.skip:focus{top:10px}.load-message{padding:24px;font-size:13px}@media(min-width:1500px){.hero{min-height:650px}.hero-content{padding-top:70px}}@media(max-width:1050px){.shell{width:calc(100% - 48px)}header{padding:0 24px}.hero-content{padding-left:32px}.section-heading{padding-inline:24px}.project-body{padding-inline:16px}.actions{gap:5px}.actions a,.actions button{font-size:9px;padding:9px 6px}.project h3{font-size:17px}.eyebrow{letter-spacing:1px}}@media(max-width:760px){.shell{width:calc(100% - 28px)}header{height:75px;padding:0 18px}.wordmark{font-size:20px}.symbol{margin-right:7px}nav{gap:17px;font-size:10px}.hero{min-height:570px}.hero-content{padding:58px 24px}h1{font-size:clamp(3rem,20vw,5.625rem);letter-spacing:-.06em}.hero:after{background:linear-gradient(90deg,#10120feb,#10120f55)}.intro{font-size:18px}.eyebrow{font-size:9px}.hero-meta{padding:15px 20px;flex-wrap:wrap;font-size:8px}.section-heading{padding:32px 20px;display:block}.section-heading p{margin-top:17px}h2{font-size:20px;line-height:1.5}.project-grid{grid-template-columns:1fr}.project{border-right:0;border-bottom:1px solid var(--line)}.project:last-child{border-bottom:0}.visual{height:210px}.project-body{padding:24px;min-height:0}.project h3,.project .description{min-height:0}.project h3{font-size:20px}.project .description{font-size:13px}.actions a,.actions button{font-size:11px;padding:12px}.caption{padding-inline:24px}footer{padding:26px 20px;align-items:flex-start;flex-direction:column}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important;animation:none!important}}
.wordmark,nav a{white-space:nowrap}@media(max-width:400px){header{padding-inline:12px}.wordmark{font-size:17px}.symbol{margin-right:1px}nav{gap:12px;font-size:9px}.hero-content{padding-inline:20px}h1{font-size:clamp(3rem,20vw,5.625rem);letter-spacing:-.06em}.eyebrow{font-size:8px;letter-spacing:.4px}.hero:after{background:linear-gradient(90deg,#10120fdd,#10120f22)}}

@keyframes ascii-wave{0%,100%{transform:translateX(-2px)}50%{transform:translateX(2px)}}
@keyframes screen-drift{0%,100%{transform:rotate(-8deg) translateY(2px)}50%{transform:rotate(-5deg) translateY(-2px)}}

.project.is-visible .ascii-row,.project.is-visible .screens{animation-play-state:running}
.motion-paused .project .ascii-row,.motion-paused .project .screens{animation-play-state:paused}
@media(hover:none){.project:hover:before{opacity:0}.project.is-visible .ascii-row,.project.is-visible .screens{animation-play-state:running}.motion-paused .project .ascii-row,.motion-paused .project .screens{animation-play-state:paused}}
@media(orientation:landscape) and (max-height:540px){.hero{min-height:0}.hero-content{padding-top:24px;padding-bottom:24px}.eyebrow{margin-bottom:14px}h1{font-size:clamp(3rem,9vw,6rem);margin-bottom:14px}.intro{font-size:16px;line-height:1.5;margin-bottom:18px}.hero-meta{padding-block:12px}}

/* Decorative live-player study, sharing the global motion control. */
.qa-art{width:min(100%,292px);height:126px;display:grid;grid-template-columns:minmax(0,1fr) 58px;grid-template-rows:1fr 22px;gap:5px;padding:6px;border:1px solid #8bded580;background:#0d1b1b;box-shadow:0 8px 20px #0003;transform:perspective(600px) rotateY(-8deg) rotateX(6deg);animation:player-drift 7s ease-in-out infinite;animation-play-state:paused}
.stream-stage{position:relative;min-width:0;overflow:hidden;border:1px solid #8bded54d;background:#122525}
.stream-screen{position:absolute;inset:9px 12px;border:1px solid #8bded533;background:#0c1717;overflow:hidden}
.stream-screen:before{content:'';position:absolute;inset:0 0 auto;height:7px;border-bottom:1px solid #8bded533;background:radial-gradient(circle at 4px 3px,#8bded570 1px,transparent 1.5px),radial-gradient(circle at 9px 3px,#8bded550 1px,transparent 1.5px)}
.stream-sidebar{position:absolute;left:0;top:8px;bottom:0;width:22%;border-right:1px solid #8bded52a;background:repeating-linear-gradient(0deg,transparent 0 9px,#8bded51a 9px 11px)}
.stream-code{position:absolute;inset:16px 10px 10px 30%;background:repeating-linear-gradient(0deg,transparent 0 7px,#8bded54d 7px 9px);clip-path:polygon(0 0,80% 0,80% 20%,55% 20%,55% 40%,100% 40%,100% 60%,65% 60%,65% 80%,85% 80%,85% 100%,0 100%)}
.stream-play{position:absolute;top:50%;left:50%;width:30px;height:30px;border:1px solid #8bded5ad;border-radius:50%;background:#0c1919e8;transform:translate(-50%,-50%)}
.stream-play:after{content:'';position:absolute;left:12px;top:9px;border-left:9px solid var(--accent);border-block:5px solid transparent}
.stream-dot{position:absolute;top:6px;right:6px;width:5px;height:5px;background:var(--accent);border-radius:50%;box-shadow:0 0 0 3px #8bded51c;animation:live-pulse 3s ease-in-out infinite;animation-play-state:paused}
.stream-thumbnails{display:grid;grid-template-rows:1fr 1fr;gap:5px;min-height:0}
.stream-thumb{position:relative;border:1px solid #8bded550;background:#142727;overflow:hidden}
.stream-thumb .stream-code{inset:5px 6px;background-size:auto 85%}
.stream-thumb:last-child{opacity:.65}
.stream-controls{grid-column:1/-1;display:flex;align-items:center;gap:9px;padding:0 3px;border-top:1px solid #8bded533}
.stream-pause{height:7px;width:6px;border-inline:2px solid var(--accent)}
.stream-volume{width:7px;height:7px;border:1px solid #8bded599;clip-path:polygon(0 30%,40% 30%,100% 0,100% 100%,40% 70%,0 70%);background:#8bded599}
.stream-progress{position:relative;flex:1;height:2px;background:#8bded52b}
.stream-progress:before{content:'';position:absolute;inset:0 4px 0 0;background:#8bded58c}
.stream-progress:after{content:'';position:absolute;right:3px;top:-2px;width:5px;height:5px;border-radius:50%;background:var(--accent)}
.stream-fullscreen{width:9px;height:7px;border:1px solid #8bded5aa;clip-path:polygon(0 0,40% 0,40% 30%,60% 30%,60% 0,100% 0,100% 40%,70% 40%,70% 60%,100% 60%,100% 100%,60% 100%,60% 70%,40% 70%,40% 100%,0 100%,0 60%,30% 60%,30% 40%,0 40%)}
.stream-scan{position:absolute;inset:0;background:linear-gradient(transparent 42%,#8bded515 49%,#8bded538 50%,transparent 52%);transform:translateY(-65%);animation:stream-scan 6s linear infinite;animation-play-state:paused}
@keyframes player-drift{0%,100%{transform:perspective(600px) rotateY(-8deg) rotateX(6deg) translateY(1px)}50%{transform:perspective(600px) rotateY(-4deg) rotateX(3deg) translateY(-1px)}}
@keyframes live-pulse{0%,100%{opacity:.55}50%{opacity:1}}
@keyframes stream-scan{to{transform:translateY(65%)}}
.project.is-visible .live-motion{animation-play-state:running}
.motion-paused .project.is-visible .live-motion{animation-play-state:paused}

.wordmark img,.footer-sign img{display:block;width:auto;height:1.2em}.wordmark{display:inline-flex;align-items:center}.footer-sign{display:inline-flex;align-items:center}h1 img{display:block;width:3.4684em;max-width:100%;height:auto}

/* Card do Liber: estante de lombadas. */
.project.rust{--accent:#e0714f}
.books{display:flex;align-items:flex-end;gap:4px;padding-bottom:3px;border-bottom:2px solid var(--accent);transform:translateY(-6px)}
.book{display:block;width:var(--w);height:var(--h);border:1px solid var(--accent);background:repeating-linear-gradient(0deg,transparent 0 9px,color-mix(in srgb,var(--accent) 35%,transparent) 9px 11px);opacity:.75;transform-origin:bottom left}
.book:nth-child(odd){background-color:color-mix(in srgb,var(--accent) 14%,transparent)}
.book.lean{transform:rotate(9deg);margin-right:10px}
/* Grade: 3 colunas em telas largas, 2 em médias, 1 no celular. Sobras ocupam a linha toda. */
.project-grid{margin-bottom:-1px}
.project{border-bottom:1px solid var(--line)}
@media(min-width:1300px){.project-grid{grid-template-columns:repeat(6,minmax(0,1fr))}.project{grid-column:span 2;border-right:1px solid var(--line)}.project:nth-child(3n){border-right:0}.project:last-child:nth-child(3n+1){grid-column:span 6;border-right:0}.project:last-child:nth-child(3n+2){grid-column:span 3;border-right:0}.project:nth-last-child(2):nth-child(3n+1){grid-column:span 3}}
@media(min-width:761px) and (max-width:1299px){.project-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.project:nth-child(2n){border-right:0}.project:last-child:nth-child(odd){grid-column:1/-1;border-right:0}}

/* Cards clicáveis e pop-up de prévia. */
.project.has-preview{cursor:pointer}
.actions button{cursor:pointer;font-family:inherit}
.actions button:hover{border-color:var(--accent);color:var(--accent)}
body:has(dialog.preview[open]){overflow:hidden}
.preview{--accent:var(--lime);padding:0;border:1px solid var(--accent);background:#131610;color:var(--text);width:min(680px,calc(100% - 28px));max-height:calc(100dvh - 28px);overflow:auto;font-family:inherit}
.preview.pink{--accent:var(--pink)}.preview.cyan{--accent:var(--cyan)}.preview.rust{--accent:#e0714f}
.preview::backdrop{background:#0a0c09e0}
.preview[open]{animation:preview-in .12s steps(3)}
@keyframes preview-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.preview .window-bar{position:sticky;top:0;z-index:2;background:#131610}
.preview-close{border:0;background:none;color:var(--muted);font:inherit;font-size:10px;cursor:pointer;padding:6px 0}
.preview-close:hover{color:var(--accent)}
.preview .visual{height:220px}
.preview-body{padding:24px 26px 28px}
.preview-body h3{font-size:22px;line-height:1.3;letter-spacing:-.7px;font-weight:400;margin:0 0 14px}
.preview-body .description{font-size:13px;line-height:1.9;color:#adb4a5;margin:0 0 18px}
.highlights{list-style:none;margin:0 0 20px;padding:0}
.highlights li{position:relative;padding:5px 0 5px 18px;font-size:12px;line-height:1.7;color:var(--text)}
.highlights li:before{content:'>';position:absolute;left:0;color:var(--accent)}
.preview .actions{margin-top:22px}
.preview .actions a.more{border-color:var(--accent);color:var(--accent)}
.preview .actions a.more:hover{background:var(--accent);color:var(--bg)}
.preview.is-visible .ascii-row,.preview.is-visible .screens,.preview.is-visible .live-motion,.preview.is-visible .book{animation-play-state:running}
.motion-paused .preview .ascii-row,.motion-paused .preview .screens,.motion-paused .preview .live-motion,.motion-paused .preview .book{animation-play-state:paused}
@media(max-width:760px){.preview-body{padding:20px}.preview .visual{height:190px}}

/* Estante do Liber: lombadas que saem da prateleira, em passos (como o resto do sistema). */
.book{animation:book-pick 5.4s steps(3) infinite;animation-delay:calc(var(--i)*-.6s);animation-play-state:paused}
.book.lean{animation-name:book-lean}
@keyframes book-pick{0%,70%,100%{translate:0 0}78%,92%{translate:0 -9px}}
@keyframes book-lean{0%,60%,100%{transform:rotate(9deg)}70%,90%{transform:rotate(5deg)}}
.project.is-visible .book{animation-play-state:running}
.motion-paused .project .book{animation-play-state:paused}

/* Limiar: relógio parado e frequência morta (uma linha reta, com um pico que passa). */
.project.amber,.preview.amber{--accent:#e8a93c}
.radio{display:flex;flex-direction:column;align-items:center;gap:14px;transform:translateY(-4px)}
.radio-clock{font-size:34px;font-weight:800;letter-spacing:-.04em;line-height:1;color:var(--accent);border:1px solid color-mix(in srgb,var(--accent) 55%,transparent);padding:8px 14px;background:color-mix(in srgb,var(--accent) 7%,transparent)}
.radio-clock .colon{animation:colon-blink 2.4s steps(1) infinite;animation-play-state:paused;padding:0 2px}
.radio-wave{display:flex;align-items:center;gap:3px;height:40px}
.radio-bar{display:block;width:3px;height:2px;background:var(--accent);opacity:.7;animation:radio-blip 4.8s steps(1) infinite;animation-delay:calc(var(--i)*-.15s);animation-play-state:paused}
.radio-label{font-size:9px;color:var(--muted);letter-spacing:.5px}
@keyframes radio-blip{0%,100%{height:2px}2%{height:26px}4%{height:8px}6%{height:36px}8%{height:4px}10%{height:2px}}
@keyframes colon-blink{0%,60%{opacity:1}61%,100%{opacity:.15}}
.project.is-visible .radio-bar,.project.is-visible .colon,.preview.is-visible .radio-bar,.preview.is-visible .colon{animation-play-state:running}
.motion-paused .project .radio-bar,.motion-paused .project .colon,.motion-paused .preview .radio-bar,.motion-paused .preview .colon{animation-play-state:paused}

/* Alternador de idioma: o idioma atual usa a cor da logo. */
nav{align-items:center}
.lang-switch{display:inline-flex;align-items:stretch;border:1px solid var(--line);font-size:11px;line-height:1}
.lang-switch>*{padding:7px 9px;color:var(--muted)}
.lang-switch>*+*{border-left:1px solid var(--line)}
.lang-switch>a:hover{color:var(--text)}
.lang-switch>[aria-current]{color:var(--lime);background:color-mix(in srgb,var(--lime) 10%,transparent)}
@media(max-width:760px){.lang-switch{font-size:10px}.lang-switch>*{padding:6px 7px}}
