:root{--bg:#0d1326;--panel:#171f3c;--panel-2:#212a49;--text:#f3f6ff;--muted:#93a0c8;--accent:#8ea6ff;--accent-2:#f4b2ff;--danger:#ff7d9c;--border:#31406d;--shadow:0 18px 44px #00000052;--font:"Yu Gothic", "Hiragino Kaku Gothic ProN", "MS Gothic", sans-serif;font:15px/1.5 var(--font);color:var(--text);background:var(--bg);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{box-sizing:border-box}body{background:radial-gradient(circle at top right, #ff7ad61f, transparent 0 22%), radial-gradient(circle at top left, #7a8cff1f, transparent 0 18%), linear-gradient(#5d72aa14 1px, transparent 1px), linear-gradient(90deg, #5d72aa14 1px, transparent 1px), var(--bg);background-size:auto,auto,41px 41px,41px 41px,auto;min-width:320px;min-height:100vh;margin:0}button{font:inherit}.app-shell{width:min(1180px,100vw - 28px);margin:0 auto;padding:28px 0}.app-header{grid-template-columns:minmax(0,1fr) 240px;align-items:stretch;gap:16px;margin-bottom:20px;display:grid}.header-title-panel{background:radial-gradient(circle at 0 0,#ffbae524,#0000 28%),radial-gradient(circle at 100% 100%,#715dff24,#0000 32%),linear-gradient(#131a2efa,#0a0e1bfa);border:1px solid #7284bf57;border-radius:22px;align-content:center;min-height:176px;padding:22px 24px;display:grid;position:relative;overflow:hidden;box-shadow:inset 0 1px #ffffff0d,0 24px 38px #0000003d}.header-title-panel:after{content:"";pointer-events:none;border:1px solid #ffffff12;border-radius:16px;position:absolute;inset:10px}.app-header p,.detail-copy p{color:var(--accent);letter-spacing:0;text-transform:uppercase;margin:0 0 8px;font-size:13px;font-weight:800}.app-header h1{color:var(--text);letter-spacing:.01em;text-shadow:3px 3px #080a11;margin:0;font-size:clamp(24px,4vw,44px);line-height:1.05}.app-title-row{z-index:1;align-items:center;gap:16px;display:flex;position:relative}.app-title-icon{object-fit:cover;width:clamp(56px,8vw,84px);height:clamp(56px,8vw,84px);image-rendering:pixelated;border:1px solid #ffffff24;border-radius:18px;flex:none;box-shadow:0 16px 28px #00000047}.app-header span,.detail-copy span{color:var(--muted)}.header-actions{justify-items:stretch;gap:8px;min-width:240px;min-height:176px;display:grid}.header-utility-row{grid-template-columns:1fr 42px;gap:8px;display:grid}.header-utility-button{min-width:0;min-height:38px;color:var(--text);background:linear-gradient(#3d2f66f5,#1a1f3bf5);border-color:#9783d861;border-radius:14px;padding:0 12px;font-size:12px;font-weight:800;box-shadow:0 10px 18px #0000002e}.header-utility-icon{place-items:center;width:42px;padding:0}.header-launcher{background:linear-gradient(#151d37fa,#0d1225fa);border:1px solid #5e70a65c;border-radius:18px;gap:8px;padding:10px;display:grid;box-shadow:inset 0 1px #ffffff0d,0 18px 32px #0000003d}.app-footer-link{justify-content:flex-end;margin-top:10px;padding:4px 6px 0;display:flex}.app-footer-link a{color:#d7deee9e;font-size:11px;text-decoration:none}.app-footer-link a:hover{color:#ffffffd1}.header-launcher-item{min-height:42px;color:var(--text);text-align:left;background:linear-gradient(#1f305ff5,#121f42f5);border:1px solid #7b91d05c;border-radius:12px;grid-template-columns:auto 1fr auto;align-items:center;gap:10px;padding:0 12px;text-decoration:none;display:grid;box-shadow:inset 0 1px #ffffff0d}.header-launcher-item strong{font-size:13px;font-weight:900}.header-launcher-item.active{background:linear-gradient(#7a4ab0f2,#4d2c7cf2);border-color:#f2c6ff}.header-launcher-item.pending{opacity:.7;grid-template-columns:auto 1fr auto}.header-launcher-item.pending small{color:var(--muted);font-size:10px;font-weight:800}.header-launcher-item:hover:not(:disabled),.header-utility-button:hover{border-color:#f2c6ff}.header-launcher-item:disabled{cursor:not-allowed}.header-launcher-icon{background:#ffffff24;border-radius:8px;place-items:center;width:22px;height:22px;font-size:12px;display:grid}.group-switcher,.game-switcher{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-bottom:14px;display:grid}.group-switcher button,.game-switcher button{text-align:left;grid-template-columns:1fr auto;gap:3px 10px;min-height:72px;display:grid}.group-switcher strong,.game-switcher strong{grid-column:1/-1;font-size:18px}.group-switcher span,.game-switcher span{color:var(--accent-2);font-size:12px}.group-switcher small,.game-switcher small{color:var(--muted)}.group-switcher button.active,.game-switcher button.active{border-color:var(--accent);background:#223245}.game-hub-block,.empty-games{gap:8px;margin-bottom:14px;display:grid}.hub-copy p,.empty-games p{color:var(--accent);text-transform:uppercase;margin:0;font-size:13px;font-weight:800}.empty-games{border:1px solid var(--border);background:var(--panel);box-shadow:var(--shadow);border-radius:8px;padding:14px}.empty-games strong{color:var(--text);font-size:22px}.empty-games span{color:var(--muted)}.group-select-screen{text-align:center;background:radial-gradient(circle at 0 0,#ffcdea14,#0000 20%),linear-gradient(#141d35fa,#0b1120fa);border:1px solid #6e80b24d;border-radius:24px;justify-items:center;gap:16px;margin-bottom:18px;padding:18px;display:grid;box-shadow:inset 0 1px #ffffff0a,0 22px 34px #00000038}.group-select-screen-themed{background:radial-gradient(circle at top left, var(--group-select-glow,#ffcdea29), transparent 22%), radial-gradient(circle at bottom right, var(--group-select-glow-soft,#715dff24), transparent 28%), linear-gradient(180deg, #141d35fa, #0b1120fa)}.group-select-screen p{color:var(--accent);text-transform:uppercase;margin:0;font-size:13px;font-weight:800}.group-select-preview{background:radial-gradient(circle at center, var(--group-select-glow-soft,#ffffff14), transparent 40%), linear-gradient(180deg, #1d2846, #121a2e);width:min(100%,720px);min-height:min(72vw,420px);box-shadow:inset 0 0 0 1px #ffffff0d, 0 0 0 1px var(--group-select-glow-soft,#ffffff14);background-size:auto,auto;border:3px solid #0a0e18;border-radius:18px;grid-template-rows:auto 1fr;place-items:center;padding:28px;display:grid}.group-select-preview:before{content:"SELECT";color:#d7deee;letter-spacing:.08em;background:#07091057;border:1px solid #ffffff1f;border-radius:999px;place-self:start;padding:6px 10px;font-size:16px;font-weight:800}.group-select-preview-inner{align-self:center;place-items:center;gap:8px;width:100%;display:grid}.game-select-preview{align-items:start;min-height:min(56vw,320px)}.game-select-preview-inner{gap:10px;width:min(100%,500px);padding-top:34px}.group-select-preview strong{color:var(--text);text-shadow:4px 4px 0 #080a11, 0 0 24px var(--group-select-glow,#ffffff1f);font-size:clamp(40px,8vw,76px);line-height:1}.group-select-preview span{color:#d7deee;font-size:13px;font-weight:800}.group-select-preview small,.group-select-preview em{color:#d7deee;max-width:560px;font-size:18px;font-style:normal;line-height:1.6}.game-select-list{gap:10px;width:100%;max-height:min(36vw,220px);padding-right:6px;display:grid;overflow-y:auto}.game-select-item{text-align:left;width:100%;color:var(--text);background:linear-gradient(#202948f0,#11182df5);border:1px solid #d7deee2e;border-radius:14px;grid-template-columns:auto 1fr auto;align-items:center;gap:12px;padding:10px 12px;display:grid;box-shadow:0 10px 18px #0003}.game-select-item strong{text-shadow:none;font-size:clamp(16px,2.6vw,22px)}.game-select-item small,.game-select-item span{color:#d7deee;font-size:12px;font-weight:800}.game-select-item.active,.game-select-item:hover{background:linear-gradient(#333f6cfa,#17213cfa);border-color:#fff48f;transform:translateY(-2px)}.game-select-skeleton,.game-select-skeleton:hover{box-shadow:none;opacity:.82;background:linear-gradient(#182038f5,#0f1626fa);border-color:#d7deee29;transform:none}.game-select-skeleton strong,.game-select-skeleton small,.game-select-skeleton span{color:#d7deeeb3}.game-select-empty{color:#d7deee;text-align:center;border:2px dashed #d7deee38;border-radius:4px;gap:8px;padding:22px 16px;display:grid}.game-select-empty strong{text-shadow:none;font-size:24px}.group-select-actions{flex-wrap:wrap;justify-content:center;gap:10px;display:flex}.select-pad{justify-items:center;gap:6px;display:grid}.select-pad-row{justify-content:center;gap:8px;display:flex}.select-pad-row-top button,.select-pad-row-bottom button{min-width:54px}.select-pad-row-middle button{min-width:62px}.group-select-actions button{border-radius:12px;min-width:74px;min-height:38px;font-size:16px}.group-select-screen-themed .group-select-actions button.primary{border-color:var(--group-select-tone,#ffe48c);background:linear-gradient(180deg, color-mix(in srgb, var(--group-select-tone,#ffe48c) 72%, white 28%), var(--group-select-tone,#ffe48c));color:#111}.present-shell,.library-shell,.harisen-shell{gap:14px}.library-shell{grid-template-columns:1fr minmax(260px,360px);align-items:start;display:grid}.library-sidebar,.character-detail,.present-shell,.harisen-shell{background:linear-gradient(#151d35fa,#0b1120fa);border:1px solid #7284bf42;border-radius:22px;padding:18px;box-shadow:inset 0 1px #ffffff0a,0 22px 36px #00000038}.present-shell,.harisen-shell{justify-items:center;display:grid}.harisen-shell{background:radial-gradient(circle at top left, #fff3, transparent 28%), radial-gradient(circle at top right, #c5aaff38, transparent 24%), linear-gradient(180deg, #ffffff0d, #d6bcff14), var(--panel);border-color:#8c72c7;position:relative;overflow:hidden}.harisen-shell:before{content:"";pointer-events:none;border:1px solid #fff3;border-radius:12px;position:absolute;inset:10px}.harisen-shell:after{content:"Penalty Game";z-index:0;color:#6a4ab8;letter-spacing:.12em;text-transform:uppercase;pointer-events:none;background:linear-gradient(#ffffffeb,#dfcfffeb);border:1px solid #6f48c98c;padding:8px 42px;font-size:11px;font-weight:900;position:absolute;top:18px;right:-34px;transform:rotate(34deg);box-shadow:0 10px 24px #55339f2e}.present-header{justify-content:space-between;align-items:start;gap:12px;width:100%;display:flex}.present-header p{color:var(--accent);text-transform:uppercase;margin:0 0 4px;font-size:13px;font-weight:800}.present-header h2{color:var(--text);margin:0;font-size:clamp(28px,5vw,48px);line-height:1}.present-description{max-width:520px;color:var(--muted);margin-top:8px;font-size:14px;line-height:1.5;display:block}.harisen-title-block{z-index:1;gap:6px;display:grid;position:relative}.harisen-badge{color:#6a4ab8;letter-spacing:.06em;text-transform:uppercase;background:#ffffffb8;border:1px solid #b59be8;border-radius:999px;justify-self:start;padding:5px 10px;font-size:11px;font-weight:900}.harisen-subtitle{color:#bda9ef;letter-spacing:.08em;text-transform:uppercase;font-size:12px;font-weight:800}.harisen-description{color:#efe7ff}.harisen-stars{color:#fff3a5;gap:10px;font-size:14px;display:flex}.harisen-title-block h2{color:#fff;text-shadow:-2px -2px #6f48c9,2px -2px #6f48c9,-2px 2px #6f48c9,2px 2px #6f48c9,0 6px 18px #4f319447}.present-score{flex-wrap:wrap;justify-content:end;gap:8px;display:flex}.present-score span{border:1px solid var(--border);background:var(--panel-2);color:var(--text);border-radius:6px;padding:9px 12px;font-weight:800}.harisen-score span{background:linear-gradient(#ffffff24,#9d6cff24);border-color:#8c72c7;box-shadow:inset 0 1px #ffffff2e}.harisen-shell .present-header,.harisen-shell .present-canvas,.harisen-shell .present-controls,.harisen-shell .harisen-notes,.harisen-shell .harisen-link{z-index:1;position:relative}.present-canvas{aspect-ratio:1;width:min(100%,720px);image-rendering:pixelated;background:#182033;border:4px solid #070910;border-radius:18px;display:block}.harisen-canvas{background:linear-gradient(#fff 0%,#e9ddff 100%);border-color:#6f48c9;box-shadow:0 18px 36px #795cc93d}.present-controls,.touch-row{flex-wrap:wrap;justify-content:center;gap:12px;display:flex}.present-controls{z-index:2;width:100%;padding:10px 0 0;position:relative}.present-controls button{background:linear-gradient(#2b3863f2,#18213cf2);border-color:#ffffff1f;border-radius:14px;min-width:132px;min-height:48px;box-shadow:0 10px 18px #0003}.present-controls button.primary{color:#151515;background:linear-gradient(#ffe48c,#ffc86f);border-color:#ffe48c}.touch-row{-webkit-touch-callout:none;-webkit-user-select:none;user-select:none;z-index:2;width:100%;padding-top:4px;display:flex;position:relative}.touch-row button{touch-action:none;-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none;-webkit-user-select:none;user-select:none;background:linear-gradient(#344475f2,#192442f2);border-color:#ffffff1f;border-radius:14px;min-width:120px;font-size:26px}.harisen-notes{flex-wrap:wrap;justify-content:center;gap:8px;display:flex}.harisen-notes span{color:#694fa8;background:#faf7ff;border:1px solid #b59be8;border-radius:999px;padding:8px 12px;font-size:12px;font-weight:800}.harisen-link{color:#6a4ab8;border-bottom:2px solid #b59be8;padding-bottom:2px;font-weight:800;text-decoration:none}.harisen-link:hover{color:#55339f;border-bottom-color:#55339f}.harisen-link:before,.harisen-link:after{content:"";background:linear-gradient(135deg,#fff7bf,#9d6cff);border-radius:2px;width:10px;height:10px;margin:0 8px 0 0;display:inline-block;transform:rotate(45deg)}.harisen-link:after{margin:0 0 0 8px}.tab-row,.costume-row{flex-wrap:wrap;gap:8px;display:flex}.tab-row button.active,.costume-row button.active{border-color:var(--group-tone,var(--accent));background:var(--group-tone,var(--accent));color:#07120f}.generation-card{border-left:6px solid var(--group-tone);background:var(--panel-2);border-radius:8px;gap:4px;margin:12px 0;padding:12px;display:grid}.generation-card span{color:var(--muted);font-size:13px}.generation-card strong{color:var(--text);font-size:28px}.character-grid{grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:10px;max-height:min(68vh,690px);padding-right:3px;display:grid;overflow:auto}.character-tile{align-content:center;justify-items:center;gap:8px;min-height:126px;padding:8px;display:grid}.character-tile.selected{border-color:var(--accent);background:#223245}.character-tile span{width:100%;color:var(--text);text-align:center;text-overflow:ellipsis;white-space:nowrap;font-size:12px;overflow:hidden}.character-detail{grid-template-rows:auto minmax(300px,1fr) auto;justify-items:start;gap:14px;min-height:620px;display:grid}.detail-copy h2{color:var(--text);text-shadow:4px 4px #080a11;margin:0 0 10px;font-size:clamp(42px,8vw,88px);line-height:1}.sprite-showcase{border:1px solid var(--border);background-color:#10131f;background-image:linear-gradient(90deg,#ffffff0d 1px,#0000 1px),linear-gradient(0deg,#ffffff0d 1px,#0000 1px),none;background-position:0 0,0 0,0 0;background-repeat:repeat,repeat,repeat;background-size:28px 28px;background-attachment:scroll,scroll,scroll;background-origin:padding-box,padding-box,padding-box;background-clip:border-box,border-box,border-box;border-radius:8px;place-items:center start;padding-left:clamp(18px,4vw,36px);display:grid;overflow:hidden}.character-sprite{object-fit:contain;width:76px;height:76px;image-rendering:pixelated}.character-sprite.large{width:min(56vw,300px);height:min(56vw,300px)}.sprite-missing{border:1px dashed var(--border);width:76px;height:76px;color:var(--muted);border-radius:6px;place-items:center;font-size:11px;display:grid}.sprite-missing.large{width:min(68vw,360px);height:min(68vw,360px);font-size:18px}button{min-height:44px;color:var(--text);cursor:pointer;background:linear-gradient(#232d4ef2,#161d34f2);border:1px solid #ffffff1f;border-radius:12px;padding:0 14px;font-weight:800;box-shadow:0 10px 18px #00000029}button.primary{color:#111;background:linear-gradient(#ffe48c,#ffc86f);border-color:#ffe48c}button:hover:not(:disabled){border-color:var(--accent)}button:disabled{cursor:not-allowed;opacity:.55}@media (width<=820px){.app-shell{width:min(100% - 16px,1180px);padding:12px 0 20px}.app-header,.library-shell,.group-switcher,.game-switcher{grid-template-columns:1fr}.app-header{gap:12px}.header-title-panel,.header-actions{min-height:auto}.header-title-panel{border-radius:18px;padding:16px}.header-actions{min-width:0}.header-utility-row{grid-template-columns:1fr 42px}.header-launcher{border-radius:16px;padding:8px}.header-launcher-item{min-height:40px}.app-title-row{align-items:center;gap:12px}.app-title-icon{border-radius:16px;width:56px;height:56px}.app-header h1{font-size:clamp(22px,7vw,32px)}.character-detail{min-height:auto}.library-shell{grid-template-columns:1fr}.character-detail{order:1}.library-sidebar{order:2}.character-sprite.large,.sprite-missing.large{width:min(52vw,220px);height:min(52vw,220px)}.character-grid{max-height:none}.group-select-actions{flex-flow:wrap;width:100%}.select-pad{width:100%}.group-select-actions button{width:auto;min-height:36px;font-size:15px}.group-select-screen{border-radius:18px;gap:12px;padding:14px}.group-select-preview{background-size:24px 24px,24px 24px,auto;border-radius:16px;width:100%;min-height:280px;padding:20px 16px}.group-select-preview:before{padding:4px 8px;font-size:12px}.group-select-preview strong{font-size:clamp(34px,12vw,54px)}.game-select-preview{min-height:300px}.game-select-preview-inner{width:100%;padding-top:28px}.game-select-list{gap:8px;max-height:180px;padding-right:2px}.game-select-item{padding:10px 12px}.game-select-item strong{font-size:18px}.present-header{gap:10px;display:grid}.present-score{justify-content:start}.present-header h2{font-size:clamp(24px,8vw,34px)}.present-description{font-size:13px}.present-canvas{border-radius:14px;width:100%}.present-controls{grid-template-columns:1fr 1fr;width:100%;display:grid}.present-controls button{width:100%;min-width:0}.touch-row{grid-template-columns:1fr 1fr;width:100%;display:grid}.touch-row button{width:100%;min-width:0}.character-detail,.library-sidebar,.present-shell,.harisen-shell{border-radius:18px;padding:14px}}