@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@500;600;700;800;900&family=Noto+Sans+JP:wght@400;500;600;700;800;900&display=swap');
:root{color-scheme:dark;--bg:#080e1e;--panel:#111a2c;--panel2:#18243a;--border:#283b58;--text:#f2f7ff;--muted:#91a2bc;--cyan:#2ce5ef;--violet:#a988ff;--gold:#ffce69;--green:#4ce7a8;--red:#ff607d;--font:'Noto Sans JP',sans-serif;--display:'Barlow Condensed',sans-serif}
*{box-sizing:border-box}body{margin:0;min-height:100vh;background:var(--bg);font-family:var(--font);color:var(--text);overflow-x:hidden}button{font-family:inherit;cursor:pointer;color:inherit}button:disabled{cursor:not-allowed;opacity:.45}button:focus-visible{outline:2px solid var(--cyan);outline-offset:3px}.ambient{position:fixed;z-index:-1;width:42vw;height:42vw;filter:blur(110px);opacity:.15;pointer-events:none;border-radius:100%}.ambient-a{background:#5c54eb;left:-19vw;top:18vh}.ambient-b{background:#04c9d6;right:-24vw;top:50vh}#app{width:min(1240px,100%);margin:0 auto;min-height:100vh;padding:0 clamp(13px,3vw,34px) 110px}.topbar{height:90px;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #ffffff13;gap:12px}.brand{border:0;background:none;display:flex;gap:12px;align-items:center;padding:4px 0;text-align:left}.brand-mark{display:grid;place-items:center;width:48px;height:48px;font:900 35px var(--display);border:2px solid var(--cyan);color:var(--cyan);transform:skew(-7deg);box-shadow:0 0 23px #2ce5ef34}.brand-mark span{font:700 14px var(--display);position:absolute;right:1px;top:0;color:var(--gold)}.brand-text{font:800 26px/0.9 var(--display);letter-spacing:.5px}.brand-text>span{color:var(--cyan)}.brand-text small{display:block;font:600 10px var(--font);color:#8c9ab4;letter-spacing:2.5px;margin-top:9px}.top-resources{display:flex;align-items:center;gap:9px}.resource{display:flex;align-items:center;gap:6px;background:#17233a;border:1px solid #2c3951;padding:8px 11px;border-radius:10px;font-size:13px;min-width:88px}.resource small{color:var(--muted);font-size:9px}.currency-symbol{color:var(--gold);font-size:21px}.fragment-symbol{color:var(--violet);font-size:20px}.icon-button{width:37px;height:38px;background:#192741;border:1px solid var(--border);border-radius:10px;font-size:19px}.section-title{font:800 clamp(36px,7vw,62px)/1 var(--display);letter-spacing:.7px;margin:0}.eyebrow{color:var(--cyan);text-transform:uppercase;letter-spacing:2.6px;font:800 12px var(--display);margin:0 0 10px}.muted{color:var(--muted)}.small{font-size:12px}.page{animation:fadein .25s ease-out}@keyframes fadein{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:translateY(0)}}.hero{position:relative;overflow:hidden;min-height:326px;display:flex;align-items:center;border:1px solid #374a67;border-radius:22px;margin:30px 0 23px;background:radial-gradient(circle at 79% 36%,#4545aa8c 0%,transparent 34%),linear-gradient(120deg,#10223b,#12233d 55%,#172047);box-shadow:0 30px 70px #0003}.hero:after{content:'R';position:absolute;right:7%;top:-66px;color:#ffffff09;font:900 540px var(--display);transform:rotate(-12deg);pointer-events:none}.hero-left{max-width:670px;padding:35px clamp(20px,4vw,54px);position:relative;z-index:1}.hero h1{font:900 clamp(58px,11vw,116px)/.76 var(--display);letter-spacing:1px;margin:0 0 21px}.hero h1 span{color:var(--cyan);text-shadow:0 0 40px #00e4fa51}.hero p{line-height:1.85;font-size:14px;max-width:500px;color:#d9e6fc}.hero-actions{display:flex;gap:9px;margin-top:24px;flex-wrap:wrap}.btn{border:none;display:inline-flex;justify-content:center;align-items:center;gap:8px;border-radius:11px;padding:13px 20px;font-weight:900;font-size:13px;transition:transform .13s,filter .13s}.btn:hover:not(:disabled){transform:translateY(-2px);filter:brightness(1.13)}.btn-primary{background:linear-gradient(135deg,#2beced,#5baeff);color:#04101b;box-shadow:0 8px 25px #16c8eb33}.btn-secondary{background:#25364f;border:1px solid #44617c;color:#e4edff}.btn-gold{background:linear-gradient(135deg,#ffe08c,#ffb85e);color:#251d0c}.btn-ghost{background:#121e31;border:1px solid var(--border)}.btn-sm{padding:9px 13px;font-size:12px}.btn-block{width:100%}.stat-strip{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:28px}.stat-box{border:1px solid var(--border);background:linear-gradient(165deg,#17243a,#101a2b);padding:19px 21px;border-radius:15px}.stat-num{font:800 33px var(--display);letter-spacing:1px}.stat-label{font-size:11px;color:var(--muted);margin-top:3px}.section-head{display:flex;gap:20px;justify-content:space-between;align-items:end;margin:32px 0 16px}.section-head h2{font:800 32px var(--display);margin:0}.grid-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:13px}.panel{background:linear-gradient(150deg,#172238,#101a2a);border:1px solid var(--border);border-radius:17px;padding:20px;min-width:0}.panel.highlight{border-color:#2ae6ed75}.feature-icon{font-size:27px;display:block;margin-bottom:10px}.panel h3{margin:6px 0 9px;font-size:17px}.panel p{font-size:12px;line-height:1.8;color:var(--muted);margin:0}.meter{background:#081526;border-radius:20px;overflow:hidden;height:7px}.meter i{display:block;height:100%;background:linear-gradient(90deg,#15a9ee,#2affd8);border-radius:20px}.stage-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px}.stage{position:relative;aspect-ratio:1.07;background:linear-gradient(140deg,#182840,#101829);border:1px solid #344661;border-radius:14px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;min-width:0}.stage:disabled{opacity:.4}.stage:not(:disabled):hover{border-color:var(--cyan)}.stage.active{background:linear-gradient(150deg,#164459,#13243d);border-color:var(--cyan);box-shadow:inset 0 0 0 1px #1fced74b}.stage-number{font:800 clamp(25px,3vw,39px) var(--display)}.stars{letter-spacing:1px;font-size:12px;color:var(--gold)}.world-head{display:flex;align-items:center;justify-content:space-between;padding:16px 5px 11px;gap:9px}.world-head h3{margin:0;font:800 23px var(--display);text-transform:uppercase}.world-head small{color:var(--muted)}.avatar-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:13px}.avatar-card{position:relative;background:linear-gradient(145deg,#19283d,#11192d);border:1px solid #34455d;border-radius:18px;padding:18px;display:flex;flex-direction:column;gap:9px}.avatar-card.selected{border-color:var(--cyan);box-shadow:inset 0 0 0 1px #1adfec88}.avatar-art{height:133px;border-radius:13px;background:radial-gradient(circle at 50% 50%,var(--accentBg),transparent 65%),#0e1728;display:flex;align-items:center;justify-content:center;font:900 95px var(--display);color:var(--accent)}.avatar-card h3{margin:2px 0 0;font-size:17px}.avatar-card .desc{color:var(--muted);font-size:12px;line-height:1.7;min-height:43px}.avatar-card .btn{margin-top:auto}.pill{border-radius:99px;padding:3px 8px;border:1px solid #36516d;font-size:10px;font-weight:800;background:#1b3047}.pill-cyan{color:var(--cyan)}.pill-gold{color:var(--gold)}.card-row{display:flex;justify-content:space-between;align-items:center;gap:9px}.law-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.law-card{display:flex;flex-direction:column;gap:10px;padding:18px;border:1px solid #354763;border-radius:15px;background:linear-gradient(135deg,#17273d,#121c30);position:relative}.law-card.locked{opacity:.72}.law-heading{display:flex;align-items:center;gap:11px}.law-icon{display:grid;place-items:center;border-radius:13px;width:50px;height:50px;font-size:28px;background:var(--shade);color:var(--accent);border:1px solid var(--accent)}.law-card h3{margin:0;font-size:16px}.law-card p{color:var(--muted);font-size:12px;line-height:1.7;margin:0;min-height:38px}.law-meta{display:flex;align-items:center;gap:5px;flex-wrap:wrap}.law-actions{display:flex;gap:8px;margin-top:auto}.law-actions .btn{flex:1;padding:10px 7px}.top-info{margin:25px 0 20px;display:flex;gap:14px;flex-wrap:wrap;justify-content:space-between;align-items:end}.note{background:#11253a;border:1px solid #27617a;padding:12px 15px;border-radius:12px;color:#bddcee;font-size:12px;line-height:1.8}.missions-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:11px}.mission{padding:18px;background:#16243a;border:1px solid #30435e;border-radius:15px;display:flex;gap:12px;align-items:center}.mission-icon{width:44px;height:44px;display:grid;place-items:center;border-radius:12px;background:#253a58;font-size:23px}.mission.complete .mission-icon{background:#20463f;color:var(--green)}.mission-text{flex:1;min-width:0}.mission-text b{display:block;font-size:13px}.mission-text small{color:var(--muted);font-size:11px}.mission-reward{font-size:11px;color:var(--gold);white-space:nowrap}.callout{padding:18px;border:1px solid #36506d;background:linear-gradient(100deg,#152d46,#161f39);border-radius:15px;margin-top:19px}.callout h3{margin:0 0 5px}.callout p{color:#aabbd1;font-size:12px;line-height:1.8;margin:0}.page-footer{color:#566e8b;font:600 11px var(--display);letter-spacing:2px;text-align:center;padding:44px 0 0}#nav{position:fixed;z-index:30;bottom:15px;left:50%;transform:translateX(-50%);width:min(620px,calc(100% - 20px));display:grid;grid-template-columns:repeat(5,1fr);background:#101d30e8;border:1px solid #354760;border-radius:16px;backdrop-filter:blur(18px);padding:6px;box-shadow:0 15px 45px #0009}.nav-btn{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:1px;padding:8px 3px;background:transparent;border:0;border-radius:11px;color:#8295ad;font-weight:800;font-size:10px;white-space:nowrap}.nav-btn span{font-size:22px;font-family:var(--display)}.nav-btn.active{background:#1b4558;color:#37f1e7}#toast{position:fixed;left:50%;bottom:95px;transform:translate(-50%,20px);padding:12px 18px;background:#21445a;border:1px solid #3b9ba6;border-radius:12px;z-index:100;box-shadow:0 9px 25px #0008;font-size:13px;font-weight:700;opacity:0;pointer-events:none;transition:opacity .2s,transform .2s;width:max-content;max-width:90vw;text-align:center}#toast.show{opacity:1;transform:translate(-50%,0)}.game-shell{margin-top:23px}.game-head{display:flex;align-items:center;justify-content:space-between;gap:9px;margin-bottom:11px;flex-wrap:wrap}.game-head h2{font:800 26px var(--display);margin:0}.game-head p{margin:3px 0 0;font-size:11px;color:var(--muted)}.game-stats{display:flex;gap:9px;align-items:center;flex-wrap:wrap}.game-stats>span{background:#16263b;border:1px solid #2c4562;border-radius:9px;padding:7px 10px;font-weight:800;font-size:12px}.game-frame{position:relative;border:2px solid #425775;border-radius:15px;overflow:hidden;background:#091225;box-shadow:0 0 35px #29dded18}.game-frame canvas{display:block;width:100%;height:auto;aspect-ratio:16/9;touch-action:none}.overlay{position:absolute;inset:0;background:#070e20d9;z-index:2;display:flex;flex-direction:column;justify-content:center;align-items:center;padding:13px;text-align:center;backdrop-filter:blur(6px)}.overlay h2{font:900 clamp(38px,8vw,80px)/1 var(--display);margin:4px 0 7px}.overlay p{font-size:12px;color:#bdd0e7;line-height:1.7;max-width:400px}.overlay .bigstars{color:var(--gold);font-size:31px;letter-spacing:5px}.overlay .overlay-actions{display:flex;gap:9px;flex-wrap:wrap;justify-content:center;margin-top:15px}.overlay .reward-text{color:var(--gold);font-weight:800}.mobile-controls{display:grid;grid-template-columns:1fr 1.4fr;gap:10px;margin:10px 0}.movement-controls,.power-controls{display:flex;gap:6px}.movement-controls button{flex:1;touch-action:none;min-height:65px;font:800 25px var(--display)}.power-controls{display:grid;grid-template-columns:repeat(4,minmax(0,1fr))}.control-btn{border:1px solid #405977;border-radius:13px;background:linear-gradient(#223652,#19283e);color:#eef7ff;box-shadow:inset 0 1px #ffffff22;touch-action:none;user-select:none}.control-btn:active,.control-btn.held{background:#246577;transform:scale(.98)}.control-btn.action{font-size:10px;min-width:0;display:flex;flex-direction:column;gap:4px;align-items:center;justify-content:center;position:relative}.control-btn.action .glyph{font-size:22px}.control-btn.action.cooldown{opacity:.5}.control-btn.jump{font-size:18px;min-height:65px}.game-help{color:#8ca2bc;font-size:11px;line-height:1.8;margin:7px 0 22px}.game-bottom{margin-top:12px;display:flex;justify-content:space-between;gap:8px;flex-wrap:wrap}.tag{color:var(--gold);font:700 12px var(--display);letter-spacing:1px}.hint-inline{font-size:11px;color:var(--muted)}.empty-message{padding:20px;border:1px dashed #34506d;border-radius:12px;color:var(--muted)}
@media(max-width:760px){.topbar{height:71px}.brand-mark{width:38px;height:38px;font-size:28px}.brand-text{font-size:21px}.brand-text small{font-size:8px;letter-spacing:1.3px}.top-resources{gap:5px}.resource{min-width:auto;padding:6px;gap:3px}.resource small{display:none}.resource b{font-size:12px}.icon-button{width:31px;height:34px}.hero{margin-top:15px;min-height:290px}.hero-left{padding:27px 22px}.hero h1{font-size:clamp(60px,16vw,89px)}.hero p{font-size:12px}.stat-box{padding:14px}.stat-num{font-size:26px}.stat-label{font-size:10px}.grid-cards{grid-template-columns:1fr}.stage-grid{grid-template-columns:repeat(4,1fr)}.avatar-grid{grid-template-columns:1fr}.avatar-card{display:grid;grid-template-columns:90px 1fr;column-gap:12px}.avatar-art{height:110px;grid-row:span 5;font-size:70px}.avatar-card .btn{grid-column:2}.law-grid,.missions-grid{grid-template-columns:1fr}.game-shell{margin-top:15px}.game-stats{gap:4px}.game-stats>span{padding:4px 8px;font-size:10px}.mobile-controls{grid-template-columns:1fr;gap:8px}.movement-controls button{min-height:57px}.power-controls{gap:6px}.control-btn.action{min-height:63px}.game-help{font-size:10px}}
@media(max-width:420px){#app{padding-left:11px;padding-right:11px}.hero h1{font-size:57px}.hero p{font-size:11px}.hero-actions .btn{padding:11px 13px}.stage-grid{gap:6px}.stage{border-radius:10px}.stage-number{font-size:27px}.stars{font-size:10px}.stat-strip{gap:7px}.stat-box{padding:11px}.stat-num{font-size:24px}.resource:first-child{min-width:63px}.resource .currency-symbol,.resource .fragment-symbol{font-size:15px}}
@media(min-width:900px){.mobile-controls{max-width:960px}.movement-controls button{min-height:70px}.game-shell{max-width:1100px;margin-left:auto;margin-right:auto}}
@media(prefers-reduced-motion:reduce){.page{animation:none}*{scroll-behavior:auto!important}}
.overlay[hidden]{display:none}
