:root{--bg:#0f1419;--bg-alt:#1a2332;--text:#e8edf4;--muted:#9aa8bc;--accent:#f97316;--border:#2d3a4f;--error:#f87171}
*,*::before,*::after{box-sizing:border-box}body{margin:0;font-family:system-ui,sans-serif;background:var(--bg);color:var(--text);line-height:1.5}
.container{max-width:1100px;margin:0 auto;padding:0 1.25rem}
.site-header{border-bottom:1px solid var(--border);background:var(--bg-alt)}
.site-header__inner{display:flex;align-items:center;justify-content:space-between;min-height:64px}
.logo{font-weight:700;font-size:1.25rem;color:var(--accent);text-decoration:none}
.site-nav{display:flex;gap:1rem;align-items:center}.site-nav a{color:var(--text);text-decoration:none}
.btn{display:inline-block;padding:.5rem 1rem;border-radius:8px;border:1px solid var(--border);background:var(--bg-alt);color:var(--text);text-decoration:none;cursor:pointer;font:inherit}
.btn--primary{background:var(--accent);border-color:var(--accent);color:#111;font-weight:600}
.btn--ghost{background:transparent}.btn--lg{padding:.75rem 1.5rem}
.hero{padding:4rem 0;background:linear-gradient(180deg,#1e293b,var(--bg))}
.hero__grid{display:grid;grid-template-columns:1fr 1fr;gap:2rem;align-items:center}
@media(max-width:768px){.hero__grid{grid-template-columns:1fr}}
.eyebrow{color:var(--accent);text-transform:uppercase;letter-spacing:.08em;font-size:.85rem}
.lead{color:var(--muted)}.hero__actions{display:flex;gap:1rem;margin-top:1.5rem;flex-wrap:wrap}
.placeholder-block{min-height:220px;border:2px dashed var(--border);display:flex;align-items:center;justify-content:center;color:var(--muted);background:repeating-linear-gradient(45deg,#1a2332,#1a2332 10px,#15202b 10px,#15202b 20px)}
.section{padding:3rem 0}.section--alt{background:var(--bg-alt)}
.card-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}@media(max-width:768px){.card-grid{grid-template-columns:1fr}}
.card{background:var(--bg);border:1px solid var(--border);border-radius:8px;padding:1.25rem;text-align:center}
.card img{image-rendering:pixelated;border-radius:4px;background:#111}
.two-col{display:grid;grid-template-columns:1fr 1fr;gap:2rem}@media(max-width:768px){.two-col{grid-template-columns:1fr}}
.site-footer{border-top:1px solid var(--border);padding:2rem 0;color:var(--muted);font-size:.9rem}
.auth-page{max-width:480px;padding:3rem 1rem;margin:0 auto}
.form label{display:block;margin-bottom:1rem;font-size:.9rem}
.form input{display:block;width:100%;margin-top:.35rem;padding:.6rem .75rem;border:1px solid var(--border);border-radius:8px;background:var(--bg-alt);color:var(--text)}
.error{color:var(--error)}.success{color:#4ade80}
.hint{color:var(--muted);font-size:.9rem;margin:.5rem 0}
.hint code{background:var(--surface);padding:.1rem .35rem;border-radius:4px}
.install-page{max-width:560px}
.install-steps{font-size:.85rem;color:var(--muted);margin:1rem 0 1.5rem;padding-left:1.25rem}
.install-steps__num{font-family:monospace;color:var(--accent)}
.install-error{background:var(--surface);border:1px solid var(--error);border-radius:8px;padding:1rem;margin:1rem 0}
.install-causes{margin:.5rem 0 0 1.25rem}
.install-debug{margin-top:.75rem;padding-top:.75rem;border-top:1px solid var(--border);font-size:.85rem}
.install-actions{display:flex;gap:.75rem;flex-wrap:wrap;margin-top:1rem}
.starter-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;margin-top:1.5rem}@media(max-width:900px){.starter-grid{grid-template-columns:1fr}}
.starter-card{border:1px solid var(--border);border-radius:8px;padding:1rem;background:var(--bg-alt)}
.starter-card img{image-rendering:pixelated}
.admin-table{width:100%;border-collapse:collapse;margin:1rem 0}.admin-table th,.admin-table td{border:1px solid var(--border);padding:.5rem .75rem;text-align:left}

/* Landing — Konoha ao Amanhecer */
:root{--landing-coal:#0b0f0d;--landing-coal-2:#111713;--landing-forest:#143827;--landing-paper:#f2eddc;--landing-amber:#f3a52f;--landing-amber-2:#ffcd6a;--landing-muted:#9da99f;--landing-line:rgba(231,235,211,.12);--landing-serif:Georgia,"Times New Roman",serif;--surface:#151d28}
html{scroll-behavior:smooth}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.site-header{position:relative;z-index:30;border-bottom:1px solid var(--border);background:var(--bg-alt)}
.has-landing .site-header{position:absolute;inset:0 0 auto;height:94px;border-bottom:1px solid rgba(255,255,255,.08);background:linear-gradient(180deg,rgba(6,10,8,.78),rgba(6,10,8,.08));backdrop-filter:blur(8px)}
.site-header__inner{min-height:76px;gap:2rem}
.has-landing .site-header__inner{min-height:94px}
.site-brand{display:inline-flex;align-items:center;gap:.8rem;color:var(--landing-paper);font-family:var(--landing-serif);font-size:1.35rem;font-weight:700;text-decoration:none;white-space:nowrap}
.site-brand__mark{position:relative;width:38px;aspect-ratio:1;border:1px solid rgba(255,205,106,.62);border-radius:50%;transform:rotate(-8deg)}
.site-brand__mark::before,.site-brand__mark::after{content:"";position:absolute;border-radius:50%}
.site-brand__mark::before{width:19px;height:19px;top:8px;left:8px;border:2px solid var(--landing-amber);border-left-color:transparent}
.site-brand__mark::after{width:7px;height:7px;top:14px;left:15px;background:var(--landing-amber-2);box-shadow:-14px 5px 0 -2px var(--landing-amber)}
.site-nav{display:flex;align-items:center;gap:1rem;margin-left:auto}
.site-nav__links{display:flex;align-items:center;gap:clamp(1.4rem,2.4vw,2.65rem);margin-right:1rem}
.site-nav a{color:#c4cbc1;text-decoration:none;font-size:.82rem;font-weight:700;letter-spacing:.04em;transition:color .2s ease,background .2s ease,border-color .2s ease}
.site-nav a:hover{color:var(--landing-amber-2)}
.site-nav__login{padding:.7rem 1rem}
.site-nav__cta{padding:.75rem 1.15rem;border:1px solid rgba(255,205,106,.48);border-radius:6px;background:rgba(243,165,47,.08);color:var(--landing-amber-2)!important}
.site-nav__cta:hover{border-color:var(--landing-amber-2);background:rgba(243,165,47,.16)}
.site-footer{border-top:1px solid var(--landing-line);padding:1.8rem 0 2.2rem;background:#090d0b;color:#69756c}
.site-footer__inner{display:flex;align-items:center;justify-content:space-between;gap:2rem}
.site-footer p{margin:0}

.landing{overflow:hidden;color:var(--landing-paper);background:radial-gradient(circle at 82% 8%,rgba(243,165,47,.11),transparent 24rem),linear-gradient(180deg,#0b100d 0%,#0d1510 50%,#090d0b 100%)}
.landing-eyebrow{margin:0 0 1.1rem;color:var(--landing-amber-2);font-size:.75rem;font-weight:800;letter-spacing:.22em;text-transform:uppercase}
.landing-eyebrow::before{content:"";display:inline-block;width:28px;height:1px;margin:0 .75rem 3px 0;background:var(--landing-amber)}
.landing-hero{position:relative;min-height:800px;isolation:isolate;overflow:hidden;border-bottom:1px solid var(--landing-line)}
.landing-hero__sky{position:absolute;z-index:-5;inset:0;background:linear-gradient(90deg,rgba(7,12,9,.99) 0%,rgba(8,13,10,.88) 34%,rgba(23,39,26,.36) 68%,rgba(8,13,10,.7) 100%),linear-gradient(180deg,#17241c 0%,#3f4f32 38%,#d97e37 75%,#101b14 100%)}
.landing-hero__sun{position:absolute;z-index:-4;top:104px;right:17.5%;width:320px;height:320px;border-radius:50%;background:radial-gradient(circle at 42% 42%,#fff0b7 0 5%,#ffc55b 28%,#ef882f 65%,rgba(224,88,35,.28) 72%,transparent 74%);box-shadow:0 0 80px rgba(247,149,49,.36),0 0 180px rgba(247,149,49,.14)}
.landing-hero__cloud{position:absolute;z-index:-3;right:3%;width:55%;height:70px;border-radius:50%;filter:blur(22px);opacity:.2;background:linear-gradient(90deg,transparent,#f7e5bb 25% 65%,transparent);transform:skewX(-18deg)}
.landing-hero__cloud--one{top:210px}.landing-hero__cloud--two{top:334px;right:-8%;width:44%;opacity:.13}
.landing-hero__mountain{position:absolute;z-index:-2;right:-4%;bottom:125px;width:62%;height:410px;background:linear-gradient(150deg,#1c3222 0 44%,#0d1710 44.5% 100%);clip-path:polygon(0 100%,8% 59%,20% 67%,32% 20%,44% 57%,57% 11%,69% 52%,79% 28%,100% 71%,100% 100%);opacity:.88}
.landing-hero__monument{position:absolute;z-index:-1;right:17%;bottom:224px;display:flex;align-items:flex-end;gap:15px;opacity:.34}
.landing-hero__monument span{width:56px;height:74px;border:2px solid #8ca07f;border-radius:46% 48% 37% 42%;background:linear-gradient(140deg,rgba(174,185,144,.22),rgba(28,43,29,.52));box-shadow:inset 8px -12px 0 rgba(5,12,8,.18);transform:rotate(var(--face-rotation))}
.landing-hero__village{position:absolute;z-index:1;inset:auto 0 0;height:250px;opacity:.95;background:linear-gradient(165deg,transparent 0 60%,#0a100c 60.2%) 0 100%/290px 180px repeat-x,linear-gradient(195deg,transparent 0 64%,#0c1510 64.3%) 110px 100%/360px 220px repeat-x;pointer-events:none}
.landing-hero__village::before{content:"";position:absolute;inset:72px 0 0;background:radial-gradient(ellipse at 50% 100%,#101a12 0 48%,transparent 49%) 6% 0/180px 112px repeat-x,linear-gradient(90deg,transparent 0 18%,#0b130e 18% 33%,transparent 33% 58%,#0b130e 58% 75%,transparent 75%) 0 65px/330px 165px repeat-x}
.landing-hero__village::after{content:"";position:absolute;inset:110px 0 0;background:radial-gradient(circle,rgba(255,181,69,.8) 0 2px,transparent 3px) 0 0/83px 42px,linear-gradient(180deg,transparent,#080c0a 78%);opacity:.62}
.landing-hero__inner{position:relative;z-index:3;display:grid;grid-template-columns:minmax(0,700px) 1fr;min-height:800px;align-items:center;padding-top:86px;padding-bottom:96px}
.landing-hero__copy{padding-top:1.1rem}
.landing-hero h1{max-width:700px;margin:0;font-family:var(--landing-serif);font-size:clamp(3.65rem,5.35vw,5.4rem);font-weight:500;line-height:.98;letter-spacing:-.055em;text-wrap:balance}
.landing-hero h1 em{color:var(--landing-amber-2);font-style:italic;font-weight:400}
.landing-lead{max-width:610px;margin:1.65rem 0 0;color:#b7c0b5;font-size:1.12rem;line-height:1.75}
.landing-actions{display:flex;flex-wrap:wrap;align-items:center;gap:.85rem;margin-top:2.1rem}
.landing-btn{display:inline-flex;min-height:54px;align-items:center;justify-content:center;gap:.8rem;padding:0 1.5rem;border:1px solid transparent;border-radius:7px;color:var(--landing-paper);text-decoration:none;font-size:.88rem;font-weight:800;letter-spacing:.02em;transition:transform .2s ease,box-shadow .2s ease,background .2s ease}
.landing-btn:hover{transform:translateY(-2px)}
.landing-btn--primary{color:#1a1207;background:linear-gradient(135deg,var(--landing-amber-2),var(--landing-amber));box-shadow:0 12px 35px rgba(240,153,37,.2)}
.landing-btn--primary:hover{box-shadow:0 16px 42px rgba(240,153,37,.3)}
.landing-btn--secondary{border-color:rgba(228,235,216,.2);background:rgba(11,17,13,.38);backdrop-filter:blur(5px)}
.landing-proof{display:flex;align-items:center;gap:.8rem;margin-top:2rem;color:#8f9c92;font-size:.72rem;font-weight:700;letter-spacing:.11em;text-transform:uppercase}
.landing-proof i{display:block;width:5px;height:5px;border-radius:50%;background:var(--landing-amber);box-shadow:0 0 12px rgba(243,165,47,.8)}

.landing-pillars{position:relative;z-index:4;margin-top:-34px}
.landing-pillars__grid{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid var(--landing-line);border-radius:12px;overflow:hidden;background:rgba(15,22,17,.95);box-shadow:0 22px 60px rgba(0,0,0,.25)}
.landing-pillar{position:relative;display:grid;grid-template-columns:52px 1fr;gap:1.1rem;min-height:230px;padding:2.4rem 2rem;border-right:1px solid var(--landing-line);overflow:hidden}
.landing-pillar:last-child{border-right:0}
.landing-pillar__number{color:var(--landing-amber-2);font-family:var(--landing-serif);font-size:2.3rem;font-style:italic}
.landing-pillar h3{margin:0 0 .75rem;font-family:var(--landing-serif);font-size:1.75rem;font-weight:500}
.landing-pillar p{margin:0;color:#909b92;font-size:.88rem;line-height:1.7}
.landing-pillar__ghost{position:absolute;right:-18px;bottom:-55px;color:rgba(255,255,255,.024);font-family:var(--landing-serif);font-size:10rem;font-weight:700}

.landing-starters{position:relative;padding:8.5rem 0 7.5rem;overflow:hidden}
.landing-starters::before{content:"忍";position:absolute;right:-35px;top:20px;color:rgba(255,255,255,.018);font-family:var(--landing-serif);font-size:27rem;line-height:1}
.landing-section-head{position:relative;display:flex;align-items:flex-end;justify-content:space-between;gap:3.75rem;margin-bottom:2.6rem}
.landing-section-head h2,.landing-final h2{margin:0;font-family:var(--landing-serif);font-size:clamp(2.65rem,4vw,3.9rem);font-weight:500;line-height:1.04;letter-spacing:-.04em}
.landing-section-head>p{max-width:430px;margin:0 0 .4rem;color:#929d95;line-height:1.7}
.landing-character-grid{position:relative;display:grid;grid-template-columns:repeat(3,1fr);gap:1.25rem}
.landing-character{--character-accent:#ffbe45;--character-silhouette:#d96c27;--character-ring:rgba(255,190,69,.3);position:relative;min-height:480px;padding:2rem;border:1px solid var(--landing-line);border-radius:12px;overflow:hidden;background:linear-gradient(145deg,rgba(68,50,20,.74),rgba(19,25,18,.96) 67%);box-shadow:inset 0 1px rgba(255,255,255,.035)}
.landing-character::before{content:"";position:absolute;width:320px;height:320px;right:-58px;top:62px;border:1px solid var(--character-ring);border-radius:50%;box-shadow:0 0 0 38px rgba(255,255,255,.012),0 0 0 82px rgba(255,255,255,.008)}
.landing-character--sasuke{--character-accent:#b4b7dc;--character-silhouette:#3b4b78;--character-ring:rgba(143,158,217,.29);background:linear-gradient(145deg,rgba(28,36,64,.78),rgba(16,22,20,.96) 68%)}
.landing-character--sakura{--character-accent:#f19aaa;--character-silhouette:#a83d55;--character-ring:rgba(241,154,170,.28);background:linear-gradient(145deg,rgba(72,31,43,.76),rgba(18,24,19,.96) 68%)}
.landing-character__top{position:relative;z-index:2;display:flex;align-items:center;justify-content:space-between;color:rgba(240,240,224,.58);font-size:.68rem;font-weight:800;letter-spacing:.16em;text-transform:uppercase}
.landing-character__nature{width:30px;height:30px;display:grid;place-items:center;border:1px solid var(--character-ring);border-radius:50%;color:var(--character-accent);font-size:.85rem}
.landing-character__figure{position:absolute;right:51px;top:112px;width:148px;height:270px;border-radius:48% 48% 32% 32%;background:radial-gradient(ellipse at 50% 19%,var(--character-accent) 0 25%,transparent 26%),linear-gradient(150deg,transparent 0 28%,var(--character-silhouette) 29% 75%,transparent 76%);filter:drop-shadow(0 18px 18px rgba(0,0,0,.3));transform:rotate(-3deg)}
.landing-character--sasuke .landing-character__figure{transform:rotate(3deg)}
.landing-character__info{position:absolute;z-index:3;inset:auto 2rem 1.9rem}
.landing-character__info small{color:var(--character-accent);font-size:.68rem;font-weight:800;letter-spacing:.15em;text-transform:uppercase}
.landing-character__info h3{margin:.45rem 0 .5rem;font-family:var(--landing-serif);font-size:2.65rem;font-weight:500;letter-spacing:-.035em}
.landing-character__info p{margin:0;color:#a0aaa2;font-size:.82rem;line-height:1.6}

.landing-final{padding-bottom:5.6rem}
.landing-final__panel{position:relative;display:grid;grid-template-columns:1fr auto;align-items:center;gap:3rem;min-height:300px;padding:4rem 4.4rem;border:1px solid rgba(255,205,106,.18);border-radius:14px;overflow:hidden;background:radial-gradient(circle at 86% 50%,rgba(245,166,48,.18),transparent 27%),linear-gradient(120deg,#182a1e,#0e1611 72%)}
.landing-final__panel::before{content:"";position:absolute;inset:auto -5% -55% 32%;height:280px;background:linear-gradient(160deg,transparent 0 48%,rgba(4,8,6,.6) 48.5%)}
.landing-final__panel>div,.landing-final__panel>.landing-btn{position:relative}
.landing-final__panel>div>p:last-child{margin:1.1rem 0 0;color:#9aa79d}
.landing-final__panel>.landing-btn{min-width:188px}

.site-brand:focus-visible,.site-nav a:focus-visible,.landing-btn:focus-visible{outline:3px solid var(--landing-amber-2);outline-offset:4px}
@media(max-width:1050px){.site-nav__links{display:none}.landing-hero__inner{grid-template-columns:1fr}.landing-hero__copy{max-width:680px}.landing-hero__sun{right:-40px;opacity:.75}.landing-hero__mountain{width:86%}.landing-pillar{grid-template-columns:1fr;padding:2rem}.landing-character-grid{grid-template-columns:1fr 1fr}.landing-character:last-child{grid-column:span 2;min-height:390px}}
@media(max-width:720px){.container{padding:0 1rem}.has-landing .site-header{height:76px}.has-landing .site-header__inner{min-height:76px}.site-brand{font-size:1.16rem}.site-brand__mark{width:32px}.site-nav__login{display:none}.site-nav__cta{padding:.65rem .8rem}.landing-hero,.landing-hero__inner{min-height:720px}.landing-hero__inner{padding-top:94px;align-items:center}.landing-hero h1{font-size:clamp(3.15rem,14vw,4.4rem)}.landing-hero__sun{width:220px;height:220px;top:110px;right:-66px;opacity:.55}.landing-lead{font-size:1rem;line-height:1.65}.landing-actions{align-items:stretch}.landing-btn{flex:1 1 100%}.landing-proof{gap:.5rem;font-size:.62rem;letter-spacing:.07em;flex-wrap:wrap}.landing-proof i{display:none}.landing-hero__village{height:170px}.landing-hero__mountain{bottom:90px;width:120%;height:330px}.landing-hero__monument{right:6%;bottom:150px;transform:scale(.75)}.landing-pillars__grid{grid-template-columns:1fr}.landing-pillar{grid-template-columns:42px 1fr;min-height:auto;padding:1.75rem;border-right:0;border-bottom:1px solid var(--landing-line)}.landing-pillar:last-child{border-bottom:0}.landing-starters{padding:6.2rem 0 5.1rem}.landing-section-head{display:block}.landing-section-head>p{margin-top:1.25rem}.landing-character-grid{grid-template-columns:1fr}.landing-character,.landing-character:last-child{grid-column:auto;min-height:420px}.landing-final__panel{grid-template-columns:1fr;padding:2.75rem 1.75rem;gap:1.9rem}.landing-final__panel>.landing-btn{justify-self:stretch}.site-footer__inner{display:block}.site-footer__inner p+p{margin-top:.55rem}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.landing-btn{transition:none}}
