@font-face{font-family:Pixelify;src:url('fonts/PixelifySans.ttf') format('truetype');font-weight:400 700;font-display:swap}
:root{color-scheme:dark;--night:#141522;--deep:#0c101a;--panel:#24263b;--panel-light:#30334a;--line:#62637b;--line-dark:#383c54;--ink:#f3e8cd;--muted:#b7b7cb;--gold:#e6b65d;--red:#be6257;--green:#a5c69a;--blue:#94b9d2;--pixel:Pixelify,'Courier New',monospace;--body:system-ui,-apple-system,'Segoe UI',sans-serif;--frame:inset 0 0 0 2px #3b4059,0 0 0 2px #0c101a,0 0 0 4px #565b74,5px 7px 0 4px #0c101a}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:24px}
body{margin:0;min-height:100vh;background:var(--night);color:var(--ink);font-family:var(--body);font-size:16px;line-height:1.65}
body::selection{color:var(--deep);background:var(--gold)}
a{color:var(--gold);text-underline-offset:4px;text-decoration-thickness:1px}
a:hover{color:#ffe0a1}
img{max-width:100%;height:auto}
button,input,select,textarea{font:inherit}
button,a,input,select,textarea{-webkit-tap-highlight-color:transparent}
button,.button{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:46px;padding:10px 21px;border:2px solid #f0cb7e;border-radius:0;background:var(--gold);box-shadow:inset -3px -3px 0 #b5813e,inset 2px 2px 0 #ffe1a3,3px 4px 0 #080d18;color:#232334;font-family:var(--pixel);font-size:20px;font-weight:600;line-height:1.25;text-decoration:none;cursor:pointer;transition:transform 80ms steps(2),background 80ms steps(2)}
button:hover,.button:hover{color:#151827;background:#f6ca7c;transform:translateY(-2px)}
button:active,.button:active{transform:translate(2px,2px);box-shadow:inset 2px 2px 0 #b5813e,1px 1px 0 #080d18}
button:disabled{opacity:.55;cursor:wait;transform:none}
.button.secondary,button.secondary{color:var(--ink);background:#252a40;border-color:#9392a7;box-shadow:inset -3px -3px 0 #151a2a,inset 2px 2px 0 #414860,3px 4px 0 #080d18}
.button.secondary:hover,button.secondary:hover{background:#343950;color:#fff3d8}
:focus-visible{outline:3px solid #ffe49a;outline-offset:5px}
[hidden]{display:none!important}
h1,h2,h3{font-family:var(--pixel);font-weight:500;line-height:1.12;overflow-wrap:anywhere}
h1{font-size:clamp(32px,4vw,48px);margin:0 0 16px}
h2{font-size:30px;margin:0 0 16px}
h3{font-size:24px;margin:0 0 12px}
p{margin:0 0 18px}
small,.muted{color:var(--muted)}
.eyebrow{display:block;margin:0 0 12px;font-family:var(--pixel);font-size:17px;line-height:1.35;letter-spacing:2px;text-transform:uppercase;color:var(--gold)}
.page-shell{width:min(1180px,calc(100% - 56px));margin:40px auto 64px}
.page-title{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:20px;margin-bottom:32px}
.page-title h1{margin-bottom:9px}.page-title p{margin-bottom:0;color:var(--muted)}
.pixel-panel{padding:28px;border:2px solid #8b899e;background:var(--panel);box-shadow:var(--frame)}
.pixel-header{position:relative;z-index:5;border-bottom:2px solid #35394e;background:#141724}
.header-inner{width:min(1240px,calc(100% - 56px));min-height:90px;margin:auto;display:flex;align-items:center;justify-content:space-between;gap:28px}
.pixel-brand{display:inline-flex;align-items:center;gap:14px;color:var(--ink);font:600 30px/1 var(--pixel);letter-spacing:1px;text-decoration:none;white-space:nowrap}
.brand-caption{display:block;max-width:5ch;color:#b1a7a5;font:11px/1.35 var(--pixel);letter-spacing:1px;white-space:normal}
.brand-mark{display:inline-block;position:relative;width:28px;height:29px;flex:none;background:linear-gradient(var(--red),var(--red)) 1px 3px/26px 5px no-repeat,linear-gradient(var(--red),var(--red)) 3px 12px/22px 4px no-repeat,linear-gradient(var(--red),var(--red)) 6px 8px/4px 21px no-repeat,linear-gradient(var(--red),var(--red)) 19px 8px/4px 21px no-repeat}
.brand-mark::before,.brand-mark::after{content:'';position:absolute;top:0;width:5px;height:5px;background:var(--red)}.brand-mark::before{left:0}.brand-mark::after{right:0}
.pixel-nav{display:flex;align-items:center;gap:26px;flex-wrap:wrap}
.pixel-nav a{position:relative;padding:12px 0;color:#c2c0cf;font-family:var(--pixel);font-size:19px;text-decoration:none;white-space:nowrap}
.pixel-nav a:hover,.pixel-nav a[aria-current]{color:var(--gold)}
.pixel-nav a[aria-current]::after{content:'';height:3px;background:var(--gold);position:absolute;bottom:1px;left:0;right:0}
.header-action{font-size:18px;min-height:40px;padding:8px 16px;white-space:nowrap}
.page-nav{display:flex;gap:20px;align-items:center;flex-wrap:wrap;margin:0 0 30px;padding:0;font-size:14px}
.page-nav a{color:var(--muted);text-decoration:none}.page-nav a:hover{color:var(--gold)}
.page-nav form{margin-left:auto}.page-nav button{min-height:36px;font-size:17px;padding:6px 14px}
.pixel-footer{display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap;padding:30px max(28px,calc((100% - 1180px)/2));border-top:2px solid var(--line-dark);background:#10131f}
.pixel-footer .pixel-brand{font-size:24px}.pixel-footer p,.pixel-footer>a:last-child{color:var(--muted);font-size:13px;margin:0}
.skip-link{position:absolute;left:20px;top:-80px;z-index:100;padding:10px 16px;background:var(--gold);color:var(--deep)}.skip-link:focus{top:10px}
label{display:block;margin-bottom:7px;color:#d1cbd2;font-size:14px;font-weight:500}
input:not([type=hidden]),select,textarea,.imput{width:100%;min-width:0;min-height:46px;padding:10px 12px;border:2px solid #62657e;border-radius:0;background:#171b2c;box-shadow:inset 2px 2px 0 #0d1220;color:var(--ink);font:inherit}
input::placeholder{color:#8e92aa}select{cursor:pointer}
input:focus,select:focus,textarea:focus{border-color:var(--gold)}
form{margin:0}
.form-feedback,.feedback{overflow-wrap:anywhere;color:#f2c88c}
.form-feedback:not(:empty),.feedback{padding:12px 16px;border-left:4px solid var(--gold);background:#332c31;margin:16px 0}
.form-feedback:empty{display:none}
.table-scroll{width:100%;overflow-x:auto}
table{border-collapse:collapse;width:100%;font-size:14px;line-height:1.5}
th,td{padding:12px 14px;text-align:left;border-bottom:1px solid #42475e;vertical-align:top}
th{color:var(--gold);background:#1b2032;font-size:12px;letter-spacing:.04em;text-transform:uppercase}
td{background:transparent}tbody tr:nth-child(even){background:#ffffff03}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
.path-art{display:block;flex:none;background-image:url('../img/pixel/caminhos.png');background-size:300% auto;background-repeat:no-repeat;aspect-ratio:1;image-rendering:pixelated;background-color:#252d43}
.path-art.ninja{background-position:0 50%}.path-art.samurai{background-position:50% 50%}.path-art.monge{background-position:100% 50%}
.path-art.generic{background-image:none;display:grid;place-items:center}.path-art.generic::before{content:'✦';font-size:48px;color:var(--gold)}
.race-art{display:block;flex:none;aspect-ratio:1;background:#252d43 center/cover no-repeat;image-rendering:pixelated}.race-art.oni{background-image:url('../img/pixel/racas/oni.png')}.race-art.kitsune{background-image:url('../img/pixel/racas/kitsune.png')}.race-art.humano{background-image:url('../img/pixel/racas/humano.png')}.race-art.generic{display:grid;place-items:center}.race-art.generic::before{content:'✦';font-size:32px;color:var(--gold)}.race-art[hidden]{display:none}
.character-art{display:block;flex:none;aspect-ratio:1;background:#252d43 center/cover no-repeat;image-rendering:pixelated}
.character-art.humano-ninja,.character-art.humano-samurai,.character-art.humano-monge{background-image:url('../img/pixel/caminhos.png');background-size:300% auto}.character-art.humano-ninja{background-position:0 50%}.character-art.humano-samurai{background-position:50% 50%}.character-art.humano-monge{background-position:100% 50%}
.character-art.oni-ninja{background-image:url('../img/pixel/combinacoes/oni-ninja.png')}.character-art.oni-samurai{background-image:url('../img/pixel/combinacoes/oni-samurai.png')}.character-art.oni-monge{background-image:url('../img/pixel/combinacoes/oni-monge.png')}
.character-art.kitsune-ninja{background-image:url('../img/pixel/combinacoes/kitsune-ninja.png')}.character-art.kitsune-samurai{background-image:url('../img/pixel/combinacoes/kitsune-samurai.png')}.character-art.kitsune-monge{background-image:url('../img/pixel/combinacoes/kitsune-monge.png')}
.character-art.tengu-ninja{background-image:url('../img/pixel/combinacoes/tengu-ninja.png')}.character-art.tengu-samurai{background-image:url('../img/pixel/combinacoes/tengu-samurai.png')}.character-art.tengu-monge{background-image:url('../img/pixel/combinacoes/tengu-monge.png')}
.character-art.kappa-ninja{background-image:url('../img/pixel/combinacoes/kappa-ninja.png')}.character-art.kappa-samurai{background-image:url('../img/pixel/combinacoes/kappa-samurai.png')}.character-art.kappa-monge{background-image:url('../img/pixel/combinacoes/kappa-monge.png')}
.character-art.tanuki-ninja{background-image:url('../img/pixel/combinacoes/tanuki-ninja.png')}.character-art.tanuki-samurai{background-image:url('../img/pixel/combinacoes/tanuki-samurai.png')}.character-art.tanuki-monge{background-image:url('../img/pixel/combinacoes/tanuki-monge.png')}
.race-rules{margin:16px 0 24px;color:var(--muted);font-size:14px}.race-rules summary{color:var(--gold);cursor:pointer;min-height:44px;padding:10px 0}.race-rules p{margin:10px 0 0;white-space:normal}
@media(max-width:1000px){.header-inner{gap:16px;flex-wrap:wrap;padding-block:20px}.pixel-nav{order:3;width:100%;justify-content:space-between;gap:12px}.header-action{margin-left:auto}.pixel-nav a{padding:4px 0}.brand-caption{max-width:none}.page-shell{margin-top:28px}}
@media(max-width:600px){.header-inner,.page-shell{width:calc(100% - 32px)}.header-inner{padding-block:16px;gap:16px}.pixel-brand{font-size:26px;gap:10px}.brand-caption{display:none}.brand-mark{transform:scale(.85)}.pixel-nav{gap:10px}.pixel-nav a{font-size:17px}.header-action{font-size:17px;padding:8px 10px;min-height:38px}.pixel-panel{padding:20px}.page-title{margin-bottom:26px;gap:16px}.page-title>.button{width:100%}.pixel-footer{padding:24px 20px;gap:18px}.pixel-footer p{width:100%;order:3}.page-nav{gap:12px;font-size:13px}h2{font-size:27px}.eyebrow{font-size:15px;letter-spacing:1px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
@media print{.pixel-header,.pixel-footer,.page-nav,button,.button{display:none}body{color:#111;background:#fff}.pixel-panel{box-shadow:none;border:1px solid #777;background:#fff}a{color:inherit}}

/* Onmyoji: retratos individuais por raca. */
.character-art.oni-onmyoji{background-image:url('../img/pixel/combinacoes/oni-onmyoji.png')}
.character-art.kitsune-onmyoji{background-image:url('../img/pixel/combinacoes/kitsune-onmyoji.png')}
.character-art.humano-onmyoji{background-image:url('../img/pixel/combinacoes/humano-onmyoji.png')}
.character-art.tengu-onmyoji{background-image:url('../img/pixel/combinacoes/tengu-onmyoji.png')}
.character-art.kappa-onmyoji{background-image:url('../img/pixel/combinacoes/kappa-onmyoji.png')}
.character-art.tanuki-onmyoji{background-image:url('../img/pixel/combinacoes/tanuki-onmyoji.png')}
.path-art.onmyoji{background-image:url('../img/pixel/combinacoes/humano-onmyoji.png');background-size:cover;background-position:center}