:root{font-family:Hiragino Sans,Yu Gothic,Meiryo,system-ui,sans-serif;color:#fff9eb;background:#15110c;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased}*{box-sizing:border-box}html,body,.game-shell,.game-shell *{touch-action:manipulation}body{margin:0;min-height:100vh;overflow:hidden;touch-action:manipulation;-webkit-tap-highlight-color:transparent;background:radial-gradient(circle at 24% 16%,rgba(246,180,40,.18),transparent 30%),linear-gradient(160deg,#15110c,#2b2419 48%,#121719)}button,.touch-pad,.map,.hud,.enemy-bar{user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}button{min-height:46px;border:2px solid #f4d27a;border-radius:8px;background:linear-gradient(#fff0a8,#d99a23);color:#20170c;font:700 1rem/1.1 inherit;box-shadow:0 4px #7d4d0f;touch-action:manipulation}button:active{transform:translateY(2px);box-shadow:0 2px #7d4d0f}button:disabled{filter:grayscale(.85);opacity:.55}.game-shell{width:min(100vw,980px);height:100dvh;margin:0 auto;display:grid;grid-template-rows:1fr auto auto;gap:10px;padding:max(10px,env(safe-area-inset-top)) 10px max(10px,env(safe-area-inset-bottom))}.screen{min-height:0;border:3px solid #f3cf7f;border-radius:8px;overflow:hidden;background:#202015;position:relative}.panel{border:3px solid #f3cf7f;border-radius:8px;background:#0c0c0af0;padding:10px;display:grid;align-content:start;gap:10px}.message{min-height:3em;display:flex;align-items:center;font-size:1rem;line-height:1.5}.message.pulse{animation:message-in .22s ease-out}@keyframes message-in{0%{opacity:.25;transform:translateY(3px)}to{opacity:1;transform:none}}.dim{color:#fff9ebad;font-size:.92rem}.gold{color:#f7c84b;font-weight:800}.bar{display:block;height:9px;border-radius:99px;background:#0000008c;border:1px solid rgba(243,207,127,.45);overflow:hidden}.bar i{display:block;height:100%;transition:width .28s ease}.bar.hp i{background:linear-gradient(90deg,#f6663c,#f7c94b)}.bar.mp i{background:linear-gradient(90deg,#3c8ff6,#7ce8f7)}.commands{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:minmax(46px,auto);align-content:start;gap:8px}.touch-pad{display:none;height:138px;grid-template-columns:repeat(3,72px);grid-template-rows:repeat(3,42px);gap:6px;justify-content:center;align-content:center}body[data-mode=explore] .touch-pad,body[data-mode=talk] .touch-pad,body[data-mode=encounter] .touch-pad{display:grid}.touch-pad [data-dir=up]{grid-column:2;grid-row:1}.touch-pad [data-dir=left]{grid-column:1;grid-row:2}.touch-pad [data-action=ok]{grid-column:2;grid-row:2}.touch-pad [data-dir=right]{grid-column:3;grid-row:2}.touch-pad [data-dir=down]{grid-column:2;grid-row:3}.title-screen,.ending-screen{display:grid;place-items:center;padding:18px;overflow:auto}.title-art{width:min(100%,620px);display:grid;grid-template-columns:minmax(0,1fr);justify-items:center;text-align:center;gap:14px}.title-art img{width:100%;max-height:52dvh;object-fit:contain;filter:drop-shadow(0 12px 20px rgba(0,0,0,.55))}.eyebrow{color:#f7c84b;font-weight:800;margin:0 0 8px}h1,h2,p{margin-top:0}h1{font-size:clamp(1.9rem,7vw,3.6rem);line-height:1.08;margin-bottom:12px;word-break:keep-all;overflow-wrap:normal}.hud{position:relative;overflow:visible;z-index:2;background:#000000b8;border-bottom:1px solid rgba(243,207,127,.35);padding:8px 12px;font-weight:800;font-size:.9rem;display:grid;gap:5px}.hud-top{display:flex;align-items:baseline;gap:10px}.hud-top strong{margin-right:auto}.hud-bars{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:3px 8px;font-size:.76rem;font-weight:700}.hud-bars b{font-variant-numeric:tabular-nums}.explore-screen,.talk-screen{align-self:center;display:grid;grid-template-rows:auto auto}.map-frame{position:relative;z-index:1;padding:8px;display:grid;place-items:center;overflow:hidden}.map{position:relative;z-index:1;width:100%;max-width:100%;max-height:62dvh;aspect-ratio:4 / 3;display:grid;grid-template-columns:repeat(var(--w),1fr);grid-template-rows:repeat(var(--h),1fr);gap:0;border-radius:6px;overflow:hidden;background:var(--map-art) center / 100% 100% no-repeat;box-shadow:0 6px 22px #0000008c}.tile{min-width:0;min-height:0;position:relative;border:0}.tile.solid{background:radial-gradient(closest-side,#0403024d,#04030214)}.tile.water,.tile.wall{background:radial-gradient(closest-side,#04030266,#04030224)}.tile.exit:after{content:"";position:absolute;inset:1px;border:2px solid rgba(250,208,90,.95);border-radius:5px;pointer-events:none;box-shadow:0 0 10px #fad05ab3,inset 0 0 14px 2px #fad05a8c;animation:exit-glow 2.2s ease-in-out infinite;will-change:opacity}@keyframes exit-glow{0%,to{opacity:.35}50%{opacity:1}}.map-marker,.hero-token{position:absolute;pointer-events:none;background-repeat:no-repeat;background-position:center bottom;background-size:contain;filter:drop-shadow(0 4px 5px rgba(0,0,0,.55))}.hero-token{z-index:5;left:50%;bottom:-6%;width:132%;aspect-ratio:1;transform:translate(-50%);background-image:url(/games/onikin-rpg/assets/hero-token.webp)}.hero-token:after{content:"";position:absolute;left:50%;bottom:1%;width:44%;height:15%;transform:translate(-50%);border-radius:50%;background:radial-gradient(closest-side,#ffe27af2,#ffbe2826 65%,#ffbe2800);animation:hero-ring 2s ease-in-out infinite}@keyframes hero-ring{0%,to{opacity:.6;transform:translate(-50%) scale(.88)}50%{opacity:1;transform:translate(-50%) scale(1.08)}}.hero-token.face-left{transform:translate(-50%) rotate(-7deg)}.hero-token.face-right{transform:translate(-50%) rotate(7deg)}.map-marker{z-index:3;left:50%;bottom:-10%;width:132%;aspect-ratio:1;transform:translate(-50%)}.marker-chest{background-image:url(/games/onikin-rpg/assets/item-chest.webp)}.marker-spring{width:160%;bottom:-28%;background-image:url(/games/onikin-rpg/assets/item-spring.webp)}.marker-herb{width:118%;bottom:-8%;background-image:url(/games/onikin-rpg/assets/item-herb.webp)}.marker-charm{width:122%;bottom:-7%;background-image:url(/games/onikin-rpg/assets/item-charm.webp)}.marker-drum{width:126%;bottom:-9%;background-image:url(/games/onikin-rpg/assets/item-drum.webp)}.marker-key{width:124%;bottom:-8%;background-image:url(/games/onikin-rpg/assets/item-key.webp)}.marker-npc{width:128%;bottom:-18%;background-image:url(/games/onikin-rpg/assets/marker-npc.webp)}.marker-heal,.marker-danger{z-index:2;left:50%;bottom:6%;width:88%;aspect-ratio:1;transform:translate(-50%);border-radius:50%;filter:none;animation:ring-pulse 2.4s ease-in-out infinite}.marker-heal{border:2px solid rgba(150,244,255,.9);box-shadow:0 0 12px 2px #78e6ffb3,inset 0 0 12px #78e6ff80}.marker-danger{width:108%;border:3px solid rgba(255,108,60,1);box-shadow:0 0 18px 4px #ff481ed9,inset 0 0 16px #ff481e99,0 0 0 1px #0009}.tile.locked:after{content:"";position:absolute;inset:12%;border-radius:5px;border:2px solid rgba(255,178,60,.8);background:linear-gradient(45deg,transparent 38%,rgba(255,178,60,.34) 40%,rgba(255,178,60,.34) 60%,transparent 62%),linear-gradient(-45deg,transparent 38%,rgba(255,178,60,.34) 40%,rgba(255,178,60,.34) 60%,transparent 62%);box-shadow:0 0 12px #ff9018b3}@keyframes ring-pulse{0%,to{opacity:.45;transform:translate(-50%) scale(.9)}50%{opacity:1;transform:translate(-50%) scale(1.05)}}.battle-screen,.encounter-screen{display:grid;grid-template-rows:auto minmax(0,1fr) auto}.battle-layout{position:relative;min-height:0;display:grid;grid-template-rows:minmax(0,1fr) auto;gap:10px;padding:12px;background:radial-gradient(circle at center 38%,rgba(247,201,75,.3),transparent 32%),linear-gradient(#110e0c57,#110e0ceb),var(--battle-bg) center / cover}.battle-layout.shake{animation:shake .28s ease-in-out}@keyframes shake{0%,to{transform:none}25%{transform:translate(-5px)}75%{transform:translate(5px)}}.enemy-stage{position:relative;min-height:0;display:grid}.enemy-card{position:relative;overflow:hidden;min-height:0}.enemy-card img{position:absolute;inset:0;box-sizing:border-box;width:100%;height:100%;object-fit:contain;object-position:center bottom;filter:drop-shadow(0 16px 22px rgba(0,0,0,.45))}.enemy-card.hit img{animation:hit-flash .34s ease-out}@keyframes hit-flash{0%{filter:brightness(3) saturate(0);transform:translate(6px)}40%{filter:brightness(1.4);transform:translate(-5px)}to{filter:drop-shadow(0 16px 22px rgba(0,0,0,.45));transform:none}}.enemy-bar{position:relative;z-index:2;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:baseline;gap:6px 10px;padding:8px 12px;border-bottom:1px solid rgba(255,140,100,.5);background:#1c0a06d1}.enemy-bar.struck{animation:enemy-struck .45s ease-out}@keyframes enemy-struck{0%{background:#965a14e6;border-bottom-color:#ffd166}to{background:#1c0a06d1;border-bottom-color:#ff8c6480}}.battle-screen .hud,.encounter-screen .hud{border-bottom:0;border-top:1px solid rgba(243,207,127,.35)}.enemy-bar strong{font-size:1rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.enemy-bar b{font-size:.85rem;font-variant-numeric:tabular-nums;color:#fff9ebd9}.enemy-bar .bar{grid-column:1 / -1;height:12px}.pop{position:absolute;left:50%;z-index:6;pointer-events:none;font-weight:900;font-size:2rem;color:#fff3c4;text-shadow:0 0 6px #000,0 3px 0 #6d2a12;animation:pop-up .75s ease-out forwards}.pop-enemy{top:22%}.pop-hero{left:auto;right:12px;bottom:100%;font-size:1.25rem;padding:1px 10px;border-radius:99px;color:#ff9a76;background:#180602e0;border:1px solid rgba(255,140,100,.75);text-shadow:0 0 4px #000}.pop-hero.heal{color:#9ff5b0;border-color:#78e696bf}.pop.crit{color:#ffe27a;font-size:2.5rem}.pop.heal{color:#9ff5b0}@keyframes pop-up{0%{opacity:0;transform:translate(-50%,12px) scale(.7)}25%{opacity:1;transform:translate(-50%,-6px) scale(1.15)}to{opacity:0;transform:translate(-50%,-46px) scale(1)}}.pop-hero{animation-name:pop-hero-up}@keyframes pop-hero-up{0%{opacity:0;transform:translateY(10px) scale(.75)}22%{opacity:1;transform:translateY(-2px) scale(1.1)}70%{opacity:1;transform:translateY(-2px) scale(1)}to{opacity:0;transform:translateY(-24px) scale(1)}}.hud.struck{animation:hud-struck .45s ease-out}@keyframes hud-struck{0%{background:#961e0fe6;border-bottom-color:#ff6b4a}to{background:#000000b8;border-bottom-color:#f3cf7f59}}.enemy-card img{padding:5% 10% 4%}.enemy-card.ember img{padding:14% 26% 10%}.enemy-card.shroom img,.enemy-card.imp img{padding:9% 18% 6%}.enemy-card.bat img{padding:11% 16% 9%}.enemy-card.wisp img{padding:9% 20% 7%}.enemy-card.castleguard img{padding:5% 12% 4%}.enemy-card.guardian img,.enemy-card.oniking img{padding:3% 3% 2%}.menu-screen,.shop-screen{display:grid;grid-template-rows:auto minmax(0,1fr);overflow:hidden}.sheet{min-height:0;overflow:auto;padding:12px;display:grid;align-content:start;gap:12px;background:linear-gradient(160deg,#2f2b23d9,#14110de6)}.panel-block{border:2px solid rgba(243,207,127,.75);border-radius:10px;background:#0000008c;padding:12px}.panel-block h3{margin:0 0 10px;font-size:.82rem;letter-spacing:.12em;color:#f7c84b}.stat-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}.stat{display:grid;grid-template-columns:1fr auto;align-items:baseline;gap:2px 8px;padding:7px 10px;border-radius:8px;background:#ffecaa14}.stat span{font-size:.8rem;white-space:nowrap;color:#fff9ebb8}.stat b{font-size:1.15rem;font-variant-numeric:tabular-nums}.stat em{grid-column:1 / -1;font-style:normal;font-size:.72rem;color:#f7c84b}.skill-line{display:flex;flex-wrap:wrap;align-items:baseline;gap:3px 10px;margin:6px 0 0;font-size:.85rem;color:#fff9ebcc}.skill-line:first-of-type{margin-top:10px;padding-top:10px;border-top:1px solid rgba(243,207,127,.25)}.skill-line strong{min-width:4.8em;font-size:.95rem;color:#fff9eb}.skill-line small{flex:1 1 13em;font-size:.76rem;line-height:1.35;color:#fff9eb8c}.foot-note{margin:10px 0 0;font-size:.74rem;color:#fff9eb73}.chip{padding:2px 8px;border-radius:99px;font-size:.72rem;font-weight:800;color:#20170c;background:linear-gradient(#ffe9a2,#e0a52c)}.item-list{list-style:none;margin:0;padding:0;display:grid;gap:8px}.item-row{display:grid;grid-template-columns:42px 1fr auto;align-items:start;gap:12px;padding:10px;border:1px solid rgba(243,207,127,.4);border-radius:10px;background:#ffecaa12}.item-row>img,.item-row>.use-btn,.item-row>.price{align-self:center}.item-row.off{opacity:.45}.item-list.shop .item-row.off{opacity:1}.item-row img{width:42px;height:42px;object-fit:contain;filter:drop-shadow(0 3px 5px rgba(0,0,0,.45))}.item-text{min-width:0;display:grid;gap:2px}.item-head{display:flex;align-items:baseline;gap:8px}.item-head strong{font-size:.98rem}.qty{font-size:.8rem;font-weight:700;color:#f7c84b;font-variant-numeric:tabular-nums}.item-text .effect{font-size:.85rem;font-weight:700;color:#9ff5b0}.item-row.off .effect{color:#fff9ebbf}.item-text .note{font-size:.76rem;line-height:1.4;color:#fff9eb9e}.use-btn{min-height:44px;padding:0 14px;font-size:.85rem;box-shadow:0 3px #7d4d0f}.price{font-size:.95rem;font-weight:800;color:#f7c84b;font-variant-numeric:tabular-nums;white-space:nowrap}.price.poor{color:#ff8a6a}.price.full{color:#fff9eb8c}.item-list.compact .item-row{grid-template-columns:34px 1fr;padding:7px 9px;gap:9px}.item-list.compact img{width:34px;height:34px}.item-list.compact .note{display:none}.ending{display:grid;gap:12px;text-align:center;max-width:680px}.ending img{width:100%;max-height:42dvh;object-fit:cover;object-position:left bottom;border-radius:8px}@media(min-width:760px){.game-shell{grid-template-columns:1fr 280px;grid-template-rows:1fr auto;padding:18px}.screen{grid-row:span 2}body:not([data-mode=explore]):not([data-mode=talk]):not([data-mode=encounter]) .panel{grid-row:span 2}.touch-pad{height:auto}}@media(max-width:430px){.game-shell{gap:7px;padding-left:7px;padding-right:7px}.title-art img{max-height:30dvh}.ending img{max-height:28dvh}.ending p{margin-bottom:8px}.message{font-size:.95rem}.commands{gap:7px}button{min-height:43px;font-size:.92rem}.touch-pad{height:126px;grid-template-columns:repeat(3,64px);grid-template-rows:repeat(3,38px)}.map-frame{padding:6px}.hud{padding:7px 10px}.sheet{padding:9px;gap:9px}.panel-block{padding:10px}.stat-grid{gap:6px}.stat{grid-template-columns:minmax(0,1fr);justify-items:center;text-align:center;gap:0;padding:6px 4px}.stat span{font-size:.7rem}.stat b{font-size:1.05rem}.stat em{font-size:.65rem}.skill-line{margin-top:8px;padding-top:8px;gap:4px 8px;font-size:.8rem}.item-row{grid-template-columns:36px 1fr auto;gap:9px;padding:8px}.item-text .note{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.menu-screen .item-text .note{display:none}.item-row img{width:36px;height:36px}.use-btn{min-height:44px;padding:0 10px;font-size:.8rem}}@media(prefers-reduced-motion:reduce){.battle-layout.shake,.enemy-card.hit img,.hud.struck,.enemy-bar.struck,.message.pulse,.tile.exit:after,.hero-token:after,.marker-heal,.marker-danger{animation:none}.pop{animation:pop-static .8s linear forwards}.pop-hero{animation-name:pop-hero-static}@keyframes pop-static{0%,80%{opacity:1;transform:translate(-50%)}to{opacity:0;transform:translate(-50%)}}@keyframes pop-hero-static{0%,80%{opacity:1;transform:translateY(-2px)}to{opacity:0;transform:translateY(-2px)}}.bar i{transition:none}}.battle-layout.appear .enemy-card{animation:enemy-appear .42s ease-out both}@keyframes enemy-appear{0%{opacity:0;transform:scale(.86) translateY(10px)}60%{opacity:1;transform:scale(1.03) translateY(0)}to{opacity:1;transform:scale(1) translateY(0)}}@media(prefers-reduced-motion:reduce){.battle-layout.appear .enemy-card{animation:none}}.skill-list{list-style:none;margin:0;padding:0;display:grid;gap:5px;align-content:end;max-height:42%;overflow:auto}.skill-row{display:flex;align-items:baseline;flex-wrap:wrap;gap:4px 8px;padding:6px 10px;border-radius:8px;border:1px solid rgba(243,207,127,.28);background:#0c0c0ae0}.skill-row.off{opacity:.45}.skill-row strong{font-size:.92rem}.skill-row .qty{color:#f3cf7f;font-size:.8rem}.skill-row .effect{color:#fff9ebcc;font-size:.8rem}.skill-line.off{opacity:.45}.equip-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-bottom:9px}.equip{display:grid;grid-template-columns:auto 1fr;align-items:baseline;gap:8px;padding:7px 10px;border-radius:8px;border:1px solid rgba(243,207,127,.3);background:#0006}.equip span{color:#fff9eb99;font-size:.78rem}.equip b{font-size:.88rem;text-align:right}.item-row.equipped{border-color:#f3cf7fcc;background:#3c2e1080}.use-btn.on{background:linear-gradient(#f3cf7f,#d8a63f);color:#201a0c}.marker-claw{width:118%;bottom:-8%;background-image:url(/games/onikin-rpg/assets/item-claw.webp)}.marker-bell{width:112%;bottom:-6%;background-image:url(/games/onikin-rpg/assets/item-bell.webp)}.marker-helm{width:120%;bottom:-8%;background-image:url(/games/onikin-rpg/assets/item-helm.webp)}.marker-band{width:116%;bottom:-6%;background-image:url(/games/onikin-rpg/assets/item-band.webp)}