:root{--bg:#070710;--panel:#0f0f1e;--border:#2a2045;--accent:#4a3888;--gold:#c9a227;--gold-light:#ffd76a;--purple:#7b2fff;--text:#e9e4f5;--muted:#a79fc2;--damage:#e8505b;--font-body:"Noto Sans JP", sans-serif;--font-title:"Noto Serif JP", "Noto Sans JP", serif;--font-en:"Cinzel", serif;--title-weight:700;--heading-weight:900;--button-shadow:0 2px 6px #00000059;--button-pressed:.9;--button-calm-hover:1.12;--streak-time:.5s;--streak-width:30%;--streak-angle:22deg;--streak-alpha:.35;--trace-time:.6s;--trace-length:20;--trace-color:#ffd76a}*{box-sizing:border-box}body{font-family:var(--font-body);color:var(--text);background:var(--bg)}.btn-gold,.btn-outline,.btn-purple{min-height:48px;font:var(--title-weight) 17px var(--font-title);cursor:pointer;box-shadow:var(--button-shadow);border-radius:8px;justify-content:center;align-items:center;padding:0 28px;text-decoration:none;transition:border-color .2s,color .2s;display:inline-flex;position:relative}.btn-gold{color:#1a0a00;background:linear-gradient(135deg,#7a5c08,#c9a227,#9a7010);border:0;overflow:hidden}.btn-gold:after{content:"";border-radius:inherit;pointer-events:none;background:linear-gradient(#ffffff1a 0%,#0000 60%);position:absolute;inset:0}.btn-outline{color:#b9b0d0;background:#0f0f1eeb;border:1px solid #4a3888}@media (hover:hover){.btn-outline:hover:not(:disabled){color:#c9a227;border-color:#c9a227}}.btn-purple{color:#fff;background:linear-gradient(135deg,#4a1a99,#7b2fff,#a855f7);border:0;overflow:hidden}.btn-gold:disabled,.btn-outline:disabled,.btn-purple:disabled{opacity:.35;cursor:default}.btn-gold:before,.btn-purple:before,.segments button[aria-pressed=true]:before{content:"";width:var(--streak-width);background:linear-gradient(90deg, transparent, rgba(255, 255, 255, var(--streak-alpha)), transparent);opacity:0;pointer-events:none;position:absolute;top:-30%;bottom:-30%;left:0}.is-streak:before{animation:button-streak var(--streak-time) ease-in-out 1}@keyframes button-streak{0%{opacity:1;transform:translateX(-200%) skewX(calc(var(--streak-angle) * -1))}to{opacity:1;transform:translateX(420%) skewX(calc(var(--streak-angle) * -1))}}.button-trace{pointer-events:none;position:absolute;overflow:visible}.button-trace rect{fill:none;stroke:var(--trace-color);stroke-width:2px;stroke-dasharray:var(--trace-length) calc(100 - var(--trace-length));animation:button-trace var(--trace-time) linear 1 forwards}@keyframes button-trace{0%{stroke-dashoffset:0}to{stroke-dashoffset:-100px}}@media (prefers-reduced-motion:reduce){.is-streak:before{animation:none}.button-trace{display:none}}@media (prefers-reduced-motion:reduce) and (hover:hover){.btn-gold:hover:not(:disabled),.btn-outline:hover:not(:disabled),.btn-purple:hover:not(:disabled),.sound-button:hover,.segments button:hover,.page-links a:hover,.play-card:hover{filter:brightness(var(--button-calm-hover))}}.btn-gold:active:not(:disabled),.btn-outline:active:not(:disabled),.btn-purple:active:not(:disabled),.sound-button:active,.segments button:active,.page-links a:active,.play-card:active,.is-pressed:not(:disabled){filter:brightness(var(--button-pressed))}.btn-gold:focus-visible,.btn-outline:focus-visible,.btn-purple:focus-visible,.play-card:focus-visible,.title-about a:focus-visible,.site-footer a:focus-visible{outline:2px solid var(--gold-light);outline-offset:2px}.panel{border:1px solid var(--border);--corner:url(/assets/frames/ui_corner_panel.webp);background:#0f0f1ef5;border-radius:14px;position:relative}.panel-corner{background:var(--corner) center / contain no-repeat;pointer-events:none;width:42px;height:42px;position:absolute}.panel-corner.tl{top:0;left:0}.panel-corner.tr{top:0;right:0;transform:scaleX(-1)}.panel-corner.bl{bottom:0;left:0;transform:scaleY(-1)}.panel-corner.br{bottom:0;right:0;transform:scale(-1)}.ad-frame{border:1px dashed var(--accent);color:#8f86ad;justify-content:center;align-items:center;font-size:14px;display:flex}.site-footer{text-align:center;color:var(--muted);padding:14px 16px 16px;font-size:13px}.site-footer nav{flex-wrap:wrap;justify-content:center;gap:0 20px;display:flex}.site-footer a{min-width:44px;min-height:44px;color:var(--text);justify-content:center;align-items:center;padding:0 2px;text-decoration:none;display:inline-flex}.site-footer a:hover{color:var(--gold-light);text-decoration:underline}.site-footer p{margin:6px 0 0}html{-webkit-text-size-adjust:100%}body{flex-direction:column;min-height:100vh;margin:0;display:flex}.page-header{text-align:center;padding:22px 16px 8px}.page-logo{font:700 34px var(--font-en);letter-spacing:.12em;color:var(--gold-light);text-shadow:0 0 14px #ffd76a66;text-decoration:none}.page-main{flex:1 0 auto;width:100%;max-width:760px;margin:0 auto;padding:12px 20px 32px;font-size:16px;line-height:1.85}.page-main h1,.page-main h2,.page-main h3{font-family:var(--font-title);font-weight:var(--heading-weight)}.page-main h1{color:var(--gold-light);margin:12px 0 18px;font-size:27px;line-height:1.4}.page-main h2{border-bottom:1px solid var(--border);color:var(--gold-light);margin:30px 0 8px;padding-bottom:4px;font-size:20px}.page-main p{margin:8px 0}.page-main ul{margin:8px 0;padding-left:1.4em}.page-main li{margin:4px 0}.page-main a:not(.btn-gold){color:#cdb7ff;padding-block:10px}.page-main table{border-collapse:collapse;width:100%;margin:8px 0}.page-main th,.page-main td{border:1px solid var(--border);text-align:left;vertical-align:top;overflow-wrap:anywhere;padding:10px 12px}.page-main th{background:var(--panel);width:8em;font-weight:700}.page-note{color:var(--muted);margin-top:28px!important}.page-start-holder{text-align:center;margin-top:36px}.page-start{min-height:56px;font-size:18px}.page-links{flex-wrap:wrap;justify-content:center;gap:4px 20px;margin:20px 0;display:flex}.page-links a{justify-content:center;align-items:center;min-width:44px;min-height:44px;position:relative;padding-block:0!important;display:inline-flex!important}@media (hover:hover){.page-links a:hover{color:#c9a227}}.card-section{scroll-margin-top:12px}.card-list{grid-template-columns:repeat(auto-fill,minmax(min(330px,100%),1fr));gap:14px;margin-top:14px;display:grid}.card-entry{border:1px solid var(--border);background:var(--panel);border-radius:12px;grid-template-columns:76px minmax(0,1fr);gap:12px;padding:12px;display:grid}.card-picture{width:76px;height:76px;position:relative}.card-picture img{width:100%;height:100%;position:absolute;inset:0}.card-picture img:first-child{object-fit:contain;width:86%;height:86%;inset:7%}.page-main .card-about h3{color:var(--gold-light);margin:0;font-size:17px;line-height:1.4}.page-main .card-about p{margin:4px 0 0;font-size:14px;line-height:1.6}.page-main .card-meta{align-items:center;gap:6px;display:flex}.card-meta img{width:18px;height:18px}.card-rarity{margin-right:8px;font-weight:700}.page-main .card-flavor{color:var(--muted)}.class-entry h2{align-items:center;gap:10px;display:flex}.class-entry h2 img{object-fit:contain;width:56px;height:56px}.class-entry .page-start-holder{margin-top:20px}.page-main .class-entry th{width:13em}.class-entry:last-of-type+.page-ad{margin-top:150px}.page-ad{width:100%;height:250px;margin-top:40px}.page-start-holder+.page-ad{margin-top:150px}
