:root{color-scheme:dark;--bg:#080b16;--panel:#101526;--panel2:#161c32;--ink:#f1f1f4;--dim:#9baac3;--line:#4e5a78;--violet:#ab91eb;--cyan:#91dae8;--gold:#e6c58d;--paper:#eeedf0;--paper-ink:#293044}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:radial-gradient(ellipse at 76% 6%,#25214a 0,transparent 27%),radial-gradient(ellipse at 8% 56%,#13283a 0,transparent 35%),var(--bg);color:var(--ink);font:14px/1.7 ui-monospace,'Cascadia Code','Microsoft YaHei',monospace}
button,input,select{font:inherit}
button,a{ -webkit-tap-highlight-color:transparent}
a{color:inherit;text-decoration:none}
button{cursor:pointer}
button:disabled{cursor:not-allowed;opacity:.55}
img{display:block;max-width:100%}
[hidden]{display:none!important}
:focus-visible{outline:2px solid var(--cyan);outline-offset:3px}
.skip{position:absolute;left:12px;top:-60px;z-index:20;background:var(--paper);color:var(--paper-ink);padding:7px 12px}
.skip:focus{top:12px}
.gacha-header{height:78px;display:flex;align-items:center;gap:36px;padding:0 clamp(20px,4vw,70px);border-bottom:1px solid #64719750;background:#090d18d9;backdrop-filter:blur(16px);position:relative;z-index:4}
.gacha-brand{display:flex;align-items:center;gap:12px;white-space:nowrap;font-size:20px;line-height:1.15;letter-spacing:.08em}
.gacha-brand b{font-weight:400;color:var(--cyan);font-size:28px}
.gacha-brand small{display:block;color:var(--dim);font-size:8px;letter-spacing:.22em;margin-top:5px}
.gacha-header nav{display:flex;align-items:center;gap:32px;margin-left:auto}
.gacha-header nav a{font-size:11px;color:var(--dim);letter-spacing:.08em}
.gacha-header nav a:hover,.gacha-footer a:hover{color:var(--cyan)}
.header-login{margin-left:16px;font-size:12px;color:var(--cyan)}
main{min-height:calc(100vh - 130px)}
.pool-list,.pool-detail{max-width:1440px;margin:auto;padding:clamp(28px,5vw,72px) clamp(20px,5vw,76px) 100px}
.page-eyebrow,.section-line{display:flex;justify-content:space-between;gap:20px;border-top:1px solid var(--line);padding-top:14px;color:var(--cyan);font-size:10px;letter-spacing:.19em;text-transform:uppercase}
.micro{color:var(--cyan);font-size:10px;letter-spacing:.16em;text-transform:uppercase}
.list-intro{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(220px,.7fr);gap:60px;align-items:end;margin:72px 0 38px}
.list-intro h1{font-size:clamp(48px,7vw,112px);line-height:1.12;letter-spacing:-.05em;font-weight:500;margin:18px 0 0}
.list-intro h1 em{font-style:normal;color:var(--violet)}
.list-intro p{max-width:390px;color:var(--dim);font-size:14px;line-height:2;border-left:1px solid var(--violet);padding-left:26px;margin:0 0 9px}
.pool-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.pool-tile{position:relative;isolation:isolate;overflow:hidden;min-height:370px;background:#18142d;border:1px solid #8b83a3;display:flex;flex-direction:column;justify-content:space-between;padding:30px;transition:transform .25s,border-color .25s}
.pool-tile:hover{transform:translateY(-5px);border-color:var(--violet)}
.pool-tile img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;z-index:-2}
.pool-tile:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#090d1cec,#0a0c18b3 54%,#11102738);z-index:-1}
.pool-tile:after{content:"";position:absolute;inset:10px;border:1px solid #e6d8ff3d;pointer-events:none}
.pool-tile .tile-top{display:flex;justify-content:space-between;gap:14px;color:var(--cyan);font-size:10px;letter-spacing:.16em}
.pool-tile .tile-type{color:var(--gold)}
.pool-tile h2{font-weight:500;font-size:clamp(30px,3.4vw,52px);line-height:1.25;max-width:440px;margin:12px 0}
.pool-tile p{color:#d4cce0;max-width:400px;margin:0}
.pool-tile .tile-bottom{display:flex;justify-content:space-between;gap:15px;padding-top:14px;border-top:1px solid #e2d6fb6b;font-size:11px;color:#dad3e7}
.pool-tile .tile-bottom b{font-weight:500;color:var(--cyan)}
.list-foot{color:var(--dim);font-size:11px;letter-spacing:.08em;margin:26px 0}
.back-link{display:inline-block;color:var(--cyan);font-size:11px;letter-spacing:.1em;padding:0 0 18px}
.back-link:hover{text-decoration:underline}
.detail-hero{position:relative;min-height:470px;display:grid;grid-template-columns:1.18fr .82fr;border-top:1px solid var(--violet);border-bottom:1px solid var(--line);background:#11182b;overflow:hidden}
.detail-art{position:relative;min-height:470px;overflow:hidden}
.detail-art img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center}
.poster-wash{position:absolute;inset:0;background:linear-gradient(90deg,transparent 40%,#11182b 100%),linear-gradient(0deg,#11182b8a,transparent 45%)}
.poster-index{position:absolute;bottom:20px;left:25px;background:#101526d9;border:1px solid #ae9adb;padding:8px 12px;color:var(--cyan);font-size:9px;letter-spacing:.18em}
.detail-copy{position:relative;overflow:hidden;padding:60px clamp(26px,5vw,74px);display:flex;flex-direction:column;justify-content:center}
.detail-copy:before{content:"";position:absolute;inset:13px;border:1px solid #b7a0df3d;pointer-events:none}
.detail-copy h1{position:relative;font-size:clamp(43px,4.8vw,76px);font-weight:500;line-height:1.22;letter-spacing:-.04em;margin:22px 0}
.detail-copy p{position:relative;color:var(--dim);margin:0;font-size:13px}
.detail-keyline{position:relative;margin-top:65px;border-top:1px solid var(--line);padding-top:13px;display:flex;justify-content:space-between;gap:10px;color:var(--cyan);font-size:9px;letter-spacing:.16em}
.seal-orbit{position:absolute;right:-35px;top:-35px;width:270px;stroke:#a989df5c;stroke-width:1;pointer-events:none}
.seal-orbit .orbit-a{animation:orbit 28s linear infinite;transform-origin:140px 140px;stroke-dasharray:5 8}
.seal-orbit .orbit-b{animation:orbit 22s linear reverse infinite;transform-origin:140px 140px}
.seal-orbit .orbit-sweep{stroke:var(--violet);stroke-width:3;animation:orbit 12s linear infinite;transform-origin:140px 140px}
.seal-orbit .orbit-diamond{stroke:#c6a5ec}
.seal-orbit .orbit-core{fill:var(--cyan);stroke:none;filter:drop-shadow(0 0 12px var(--cyan))}
@keyframes orbit{to{transform:rotate(360deg)}
}
.contract-layout{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(310px,.7fr);gap:24px;margin-top:32px}
.contract-console,.contract-notes,.draw-history{border:1px solid #6d739663;background:linear-gradient(150deg,#141a30,#0d1426);padding:clamp(22px,3vw,40px)}
.contract-console h2,.contract-notes h2,.draw-history h2{font-weight:500;font-size:clamp(23px,2.4vw,35px);line-height:1.4;margin:22px 0}
.contract-console .section-line,.contract-notes .section-line,.draw-history .section-line{border-top:0;padding-top:0}
.section-line span:last-child{color:var(--dim)}
.wallet-row{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:26px 0}
.wallet-row>div{background:#090f1e;border-left:2px solid var(--violet);padding:16px 18px}
.wallet-row>div+div{border-left-color:var(--gold)}
.wallet-row small{display:block;color:var(--dim);font-size:10px}
.wallet-row strong{font-size:29px;color:var(--ink);font-weight:500;line-height:1.5}
.pity-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin:20px 0 26px}
.pity-grid>div{display:grid;grid-template-columns:1fr auto;gap:5px 10px;font-size:11px;color:var(--dim)}
.pity-grid strong{font-weight:500;color:var(--cyan)}
.pity-grid i{grid-column:1/-1;display:block;height:4px;background:#52607a}
.pity-grid b{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--violet),var(--cyan));transition:width .3s}
.target-label{display:block;color:var(--cyan);font-size:11px;letter-spacing:.1em;margin-bottom:8px}
.contract-console select{width:100%;height:46px;background:#0a1122;color:var(--ink);border:1px solid var(--line);padding:0 12px}
.target-hint{font-size:10px;color:var(--dim);margin:8px 0 24px}
.draw-actions{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.draw-actions button{min-height:76px;text-align:left;background:#232142;border:1px solid #b39be1;color:var(--ink);padding:13px 17px;transition:background .2s,transform .2s}
.draw-actions button:hover{background:#343063;transform:translateY(-2px)}
.draw-actions button+button{background:linear-gradient(110deg,#4b376a,#23364b);border-color:var(--gold)}
.draw-actions button+button:hover{background:linear-gradient(110deg,#684e8d,#2c4b62)}
.draw-actions span{display:block;font-size:17px;font-weight:500}
.draw-actions b{display:block;color:var(--gold);font-size:10px;font-weight:400;margin-top:4px}
.console-message{min-height:24px;color:var(--cyan);font-size:11px}
.login-link{color:var(--gold);border-bottom:1px solid var(--gold);padding-bottom:3px;font-size:12px}
.contract-notes{background:linear-gradient(150deg,#1d1a36,#111827)}
.contract-notes h2{color:#eee8f8}
.contract-notes ol{padding-left:22px;margin:25px 0;color:#b9bbce;font-size:11px;line-height:1.85}
.contract-notes li{margin-bottom:12px;padding-left:5px}
.contract-notes li::marker{color:var(--gold)}
.contract-notes details{border-top:1px solid var(--line);padding-top:18px;margin-top:35px}
.contract-notes summary{cursor:pointer;color:var(--cyan);font-size:11px;list-style:none;display:flex;justify-content:space-between}
.contract-notes summary::-webkit-details-marker{display:none}
.probability-list{padding-top:16px;color:var(--dim);font-size:10px}
.probability-list div{display:flex;justify-content:space-between;gap:15px;padding:7px 0;border-bottom:1px solid #6e739438}
.probability-list strong{color:var(--ink);font-weight:500}
.featured{margin-top:90px}
.featured-heading{display:flex;align-items:end;justify-content:space-between;gap:30px;padding-bottom:23px;border-bottom:1px solid var(--line)}
.featured-heading h2{font-size:clamp(28px,3.2vw,46px);line-height:1.25;font-weight:500;margin:12px 0 0}
.featured-heading h2 span{color:var(--violet)}
.featured-heading p{color:var(--dim);font-size:11px;max-width:280px}
.featured-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:13px;margin-top:24px}
.employee-dossier{display:flex;flex-direction:column;background:#eff0f1;color:#172133;border:1px solid #c6c1d2;min-width:0;transition:transform .25s,box-shadow .25s}
.employee-dossier:hover{transform:translateY(-7px);box-shadow:0 20px 40px #0008}
.employee-dossier .dossier-art{height:260px;position:relative;overflow:hidden;background:radial-gradient(circle at 50% 42%,#c7b5e5,#f0f1f3 65%)}
.employee-dossier .dossier-art:before{content:"";position:absolute;inset:14px;border:1px solid #7d729560;z-index:2;pointer-events:none}
.employee-dossier .dossier-art img{width:100%;height:100%;object-fit:contain;object-position:center bottom}
.employee-dossier .dossier-no{position:absolute;left:14px;top:13px;background:#192235;color:#d5d9e5;padding:3px 6px;font-size:9px;z-index:3}
.employee-dossier .dossier-info{padding:15px;min-height:112px;display:flex;flex-direction:column}
.employee-dossier .dossier-info small{color:#61748a;font-size:9px}
.employee-dossier .dossier-info strong{font-size:18px;font-weight:500;line-height:1.4;margin-top:6px}
.employee-dossier .dossier-info span{color:#49407a;font-size:10px;margin-top:auto}
.draw-history{margin-top:72px}
.history-list{display:grid;gap:10px}
.history-row{display:grid;grid-template-columns:1fr 1fr auto;gap:15px;align-items:center;border-top:1px solid var(--line);padding:12px 0;color:var(--dim);font-size:11px}
.history-row b{color:var(--ink);font-weight:500}
.history-row small{color:var(--gold)}
.gacha-footer{display:flex;justify-content:space-between;gap:20px;padding:24px clamp(20px,5vw,76px);border-top:1px solid var(--line);color:var(--dim);font-size:10px;letter-spacing:.1em}
.payment-dialog,.draw-dialog{padding:0;border:1px solid #9d91bd;background:#131729;color:var(--ink);box-shadow:0 30px 90px #000c}
.payment-dialog::backdrop,.draw-dialog::backdrop{background:#050711dc;backdrop-filter:blur(6px)}
.payment-dialog{width:min(92vw,500px)}
.payment-dialog form{position:relative;padding:35px}
.payment-dialog h2{font-size:27px;font-weight:500;margin:12px 0}
.payment-dialog p{color:var(--dim);font-size:12px}
.dialog-x{position:absolute;right:18px;top:13px;border:0;background:transparent;color:var(--ink);font-size:26px}
.payment-ledger{margin:25px 0;background:#0a1020;border:1px solid var(--line)}
.payment-ledger>div{display:flex;justify-content:space-between;gap:20px;padding:13px 16px;border-bottom:1px solid var(--line);font-size:12px}
.payment-ledger>div:last-child{border-bottom:0}
.payment-ledger strong{font-size:16px;font-weight:500;color:var(--gold);text-align:right}
.dialog-actions{display:flex;justify-content:flex-end;gap:9px;margin-top:27px}
.dialog-actions button{padding:10px 15px;border:1px solid var(--line);color:var(--ink);background:#192139}
.dialog-actions #confirm-draw{background:#bca5e6;color:#111421;border-color:#bca5e6;font-weight:500}
.draw-dialog{width:min(95vw,1190px);max-width:none;max-height:94vh;overflow-y:auto}
.reveal-shell{position:relative;overflow:hidden;min-height:650px;background:radial-gradient(circle at 50% 44%,#2c2854 0,#121629 45%,#080d1c 100%);padding:23px clamp(16px,3vw,40px) 26px}
.reveal-shell:before{content:"";position:absolute;inset:9px;border:1px solid #b2a6d747;pointer-events:none}
.reveal-top,.reveal-bottom{position:relative;z-index:4;display:flex;justify-content:space-between;align-items:center;gap:15px;color:var(--cyan);font-size:10px;letter-spacing:.13em}
.reveal-top button,.reveal-bottom button{border:0;background:transparent;color:var(--gold);text-decoration:underline;cursor:pointer;font-size:11px}
.reveal-shell h2{position:relative;z-index:4;text-align:center;font-size:clamp(23px,3vw,38px);font-weight:500;margin:14px 0 0}
.reveal-scene{position:relative;min-height:510px;display:grid;place-items:center}
.reveal-signal{position:absolute;inset:0;width:100%;height:100%;stroke:#9f94d970;stroke-width:1;fill:none;pointer-events:none}
.reveal-signal path:first-child{stroke-dasharray:10 9;animation:signal-dash 16s linear infinite}
.reveal-signal circle{stroke-dasharray:9 16;animation:orbit 24s linear infinite;transform-origin:400px 210px}
.reveal-signal circle+circle{animation-direction:reverse;animation-duration:32s}
.reveal-signal path:last-child{opacity:.35}
@keyframes signal-dash{to{stroke-dashoffset:-228}
}
.paper-stack{position:relative;width:min(330px,72vw);height:390px;perspective:900px;transition:transform .6s,opacity .4s}
.paper{position:absolute;inset:0;clip-path:polygon(0 0,87% 0,100% 12%,100% 100%,0 100%);background:var(--paper);border:2px solid #d1c9e4;box-shadow:0 24px 40px #0008}
.paper-back{transform:translate(-20px,-14px) rotate(-8deg)}
.paper-mid{transform:translate(13px,-9px) rotate(5deg)}
.paper-front{display:flex;flex-direction:column;padding:24px;color:var(--paper-ink);background:linear-gradient(125deg,#f4f3f4,#dddbe7)}
.paper-front:before{content:"";position:absolute;inset:12px;border:1px solid #6e7082;pointer-events:none}
.paper-front small{font-size:9px;letter-spacing:.1em}
.paper-front b{font-size:25px;font-weight:500;margin:60px 0 10px;letter-spacing:.15em}
.paper-front span{font-size:10px;line-height:1.7}
.paper-front i{margin-top:auto;font-size:11px;color:#696283;font-style:normal}
.stamp{position:absolute;z-index:3;right:-34px;bottom:12px;width:105px;height:105px;border:6px double #a24974;border-radius:50%;background:#6d2649;color:#ffe6ef;box-shadow:0 13px 20px #0009,0 0 0 7px #a2497455;transform:rotate(-12deg);transition:transform .2s}
.stamp:hover{transform:rotate(0) scale(1.08)}
.stamp:active{transform:scale(.85)}
.stamp span{display:block;font-size:24px;line-height:1}
.stamp b{display:block;font-size:13px;font-weight:500;line-height:1.2}
.reveal-shell[data-phase=open] .paper-stack{transform:translateY(180px) rotateX(65deg) scale(.6);opacity:0;pointer-events:none}
.result-grid{position:absolute;inset:15px 0 7px;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:11px;align-items:stretch;justify-items:stretch;opacity:0;pointer-events:none;transform:scale(.82);transition:opacity .55s,transform .55s}
.reveal-shell[data-phase=open] .result-grid{opacity:1;pointer-events:auto;transform:scale(1)}
.result-grid.is-single{display:flex;align-items:center;justify-content:center}
.result-card{position:relative;min-width:0;min-height:200px;padding:0;border:1px solid #cbc6d8;background:#d9d8e2;color:#212738;overflow:hidden;box-shadow:0 13px 20px #0007;animation:fly-in .7s both;animation-delay:var(--stagger);transition:transform .2s,box-shadow .2s}
.result-card:hover{transform:translateY(-5px)}
.result-grid.is-single .result-card{width:min(270px,85%);height:350px}
.result-card .contract-back,.result-card .result-face{position:absolute;inset:0;display:flex;flex-direction:column;padding:14px;text-align:left}
.contract-back{background:repeating-linear-gradient(0deg,#e8e7ed,#e8e7ed 19px,#e0dfe8 20px);border:7px solid #eae9ef}
.contract-back:before{content:"";position:absolute;inset:11px;border:1px solid #596174}
.contract-back small,.contract-back span{position:relative;font-size:9px}
.contract-back b{position:relative;margin:auto 0;color:#5b526b;font-size:42px;font-weight:400;line-height:1;text-align:center}
.contract-back span{margin-top:auto}
.result-face{z-index:2;opacity:0;visibility:hidden;transition:opacity .35s;background:#ecedf0}
.result-card.is-revealed .result-face{opacity:1;visibility:visible}
.result-face small{font-size:9px;color:#586980;letter-spacing:.1em}
.result-face img{width:100%;height:68%;object-fit:contain;object-position:center bottom;margin:auto 0}
.result-face strong{font-size:14px;line-height:1.35;font-weight:500}
.result-face em{font-size:9px;color:#625377;font-style:normal}
.result-card[data-kind=employee] .result-face{background:radial-gradient(circle at 50% 43%,#c4a8e7,#eae7f1 68%)}
.result-card[data-kind=employee] .contract-back{border-color:#b69cd1}
.result-card.is-connecting{animation:document-shake .45s linear both,signal-glow .9s ease-in-out both}
.result-card .connect-lines{position:absolute;z-index:4;inset:0;width:100%;height:100%;opacity:0;pointer-events:none;stroke:#83e8ef;stroke-width:2;fill:none;stroke-dasharray:130;stroke-dashoffset:130}
.result-card.is-connecting .connect-lines{opacity:1;animation:connect .55s linear forwards}
@keyframes connect{to{stroke-dashoffset:0}
}
@keyframes document-shake{0%,100%{transform:translateX(0)}
20%{transform:translateX(-7px)}
40%{transform:translateX(7px)}
60%{transform:translateX(-5px)}
80%{transform:translateX(5px)}
}
@keyframes signal-glow{50%{box-shadow:0 0 30px #91dae8}
}
@keyframes fly-in{from{opacity:0;transform:translateY(90px) rotate(-8deg) scale(.55)}
to{opacity:1;transform:translateY(0) rotate(0) scale(1)}
}
.reveal-bottom{border-top:1px solid #aab4d34d;padding-top:17px}
.reveal-bottom span{color:var(--dim)}
.reveal-bottom button{border:1px solid var(--gold);padding:10px 14px;text-decoration:none}
.result-card.is-revealed .contract-back{visibility:hidden}
.result-card[data-kind=resource] .result-face{justify-content:center;align-items:center;text-align:center;background:radial-gradient(circle,#c5dce2,#e5eaed)}
.result-card[data-kind=resource] .result-face strong{font-size:17px}
.result-card[data-kind=resource] .result-face .resource-glyph{font-size:35px;color:#617b93;margin:15px 0}

@media(max-width:1050px){.featured-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
.contract-layout{grid-template-columns:1fr}
.result-grid{grid-template-columns:repeat(5,minmax(0,1fr))}
.result-card{min-height:170px}
}

@media(max-width:700px){.gacha-header{height:auto;min-height:67px;padding:13px 18px;gap:15px;flex-wrap:wrap}
.gacha-header nav{order:3;width:100%;gap:18px;justify-content:space-between;margin:0}
.gacha-header nav a{font-size:10px}
.header-login{margin-left:auto}
.pool-list,.pool-detail{padding:28px 18px 80px}
.list-intro{grid-template-columns:1fr;gap:24px;margin:46px 0 28px}
.list-intro h1{font-size:clamp(44px,11vw,66px)}
.list-intro p{padding-left:18px}
.pool-grid{grid-template-columns:1fr}
.pool-tile{min-height:320px;padding:24px}
.detail-hero{grid-template-columns:1fr}
.detail-art{min-height:260px}
.detail-copy{min-height:270px;padding:30px}
.detail-keyline{margin-top:30px}
.seal-orbit{width:210px;right:-70px}
.featured{margin-top:60px}
.featured-heading{display:block}
.featured-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.employee-dossier .dossier-art{height:235px}
.history-row{grid-template-columns:1fr auto}
.history-row b{grid-column:1/-1}
.reveal-shell{min-height:550px}
.reveal-scene{min-height:430px}
.result-grid{position:relative;inset:auto;min-height:360px;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.reveal-shell[data-phase=sealed] .result-grid{display:none}
.reveal-shell[data-phase=open] .paper-stack{display:none}
.result-card{min-height:195px}
.result-grid.is-single .result-card{height:330px}
}

@media(max-width:420px){.gacha-brand{font-size:16px}
.gacha-brand b{font-size:23px}
.wallet-row,.pity-grid,.draw-actions{gap:8px}
.wallet-row>div{padding:11px}
.wallet-row strong{font-size:24px}
.draw-actions button{padding:10px}
.draw-actions span{font-size:14px}
.featured-grid{gap:8px}
.employee-dossier .dossier-art{height:190px}
.employee-dossier .dossier-info{padding:10px}
.employee-dossier .dossier-info strong{font-size:15px}
.result-card{min-height:175px}
}

@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
}

.pool-grid.single-pool{grid-template-columns:minmax(0,1fr)}
.pool-grid.single-pool .pool-tile{min-height:430px}

@media(max-width:700px){.pool-grid.single-pool .pool-tile{min-height:320px}
}

.pool-tile img{transform:scale(1.18);transform-origin:right center;object-position:right center}
.detail-art img{transform:scale(1.7);transform-origin:right center;object-position:right center}
.detail-copy h1{font-size:clamp(40px,4vw,62px)}

.pool-tile:before{background:linear-gradient(90deg,#090d1c 0 25%,#090d1cf4 37%,#0a0c18ad 61%,#11102738 100%)}
@media(max-width:500px){.payment-dialog form{padding:28px 22px}.payment-ledger>div{display:grid;gap:4px}.payment-ledger strong{text-align:left;font-size:15px;white-space:nowrap}}

/* Open pool dossiers are cut paper files, with angular SVG light curtains. */
.pool-tile{clip-path:polygon(0 0,calc(100% - 66px) 0,100% 66px,100% 100%,0 100%);border:0;outline:1px solid #b5a8d9;background:#17162d;box-shadow:inset 0 0 0 1px #998bbb;min-height:430px;padding:39px 43px 32px}
.pool-tile:after{inset:12px;clip-path:polygon(0 0,calc(100% - 58px) 0,100% 58px,100% 100%,0 100%);border-color:#e6d8ff66}
.pool-tile:hover{transform:translateY(-7px)}
.pool-tile .tile-fold{position:absolute;right:0;top:0;width:66px;height:66px;z-index:3;background:linear-gradient(135deg,#f4f1fc 0 47%,#b7a9db 48% 55%,#6d628c 56%);clip-path:polygon(0 0,100% 100%,0 100%);transform:rotate(180deg);filter:drop-shadow(-3px 3px 4px #0009)}
.pool-tile .tile-file-side{position:absolute;right:22px;top:90px;bottom:31px;z-index:1;display:flex;flex-direction:column;align-items:center;gap:14px;border-left:1px solid #cbb8ee7a;padding-left:12px;color:#c6b4e8;writing-mode:vertical-rl;letter-spacing:.25em;font-size:9px}
.pool-tile .tile-file-side b{font-size:22px;writing-mode:horizontal-tb;font-weight:400}
.pool-tile .tile-circuit{position:absolute;right:7%;top:17%;width:230px;height:230px;z-index:0;fill:none;stroke:#bfa2eb88;stroke-width:1;pointer-events:none;animation:tile-orbit 25s linear infinite;transform-origin:center}
.pool-tile .tile-circuit circle{stroke-dasharray:8 9}
.pool-tile .tile-circuit-core{stroke:#e6c58d;stroke-width:2;filter:drop-shadow(0 0 10px #f2cf9c)}
.pool-tile .tile-chevron-curtain{position:absolute;inset:0;width:100%;height:100%;z-index:1;pointer-events:none;fill:#a1ecf35c;filter:drop-shadow(0 0 19px #b7ffff);transform:translateX(-115%) skewX(-9deg)}
.pool-tile:hover .tile-chevron-curtain,.pool-tile:focus-visible .tile-chevron-curtain{animation:tile-chevron-sweep .85s cubic-bezier(.1,.55,.25,1) both}
.pool-tile .tile-top,.pool-tile>div:not(.tile-file-side){position:relative;z-index:2}
.gacha-header nav{margin-right:145px}
.pool-tile .tile-bottom{margin-right:29px}
@keyframes tile-chevron-sweep{0%{transform:translateX(-115%) skewX(-9deg);opacity:0}20%{opacity:1}100%{transform:translateX(145%) skewX(-9deg);opacity:0}}
@keyframes tile-orbit{to{transform:rotate(360deg)}}
.pool-grid.single-pool .pool-tile{min-height:450px}

/* Interactive signing desk. The visitor's sentence lives only in this browser reveal. */
.contract-message-label{display:block;margin:21px 0 8px;color:var(--cyan);font-size:12px;letter-spacing:.08em}
.contract-message-label small{display:block;color:var(--dim);font-size:10px;letter-spacing:0;margin-top:3px}
#contract-message{display:block;width:100%;resize:vertical;min-height:72px;max-height:150px;padding:10px 12px;border:1px solid #8c85a8;background:#0b1121;color:var(--ink);line-height:1.5}
#contract-message:focus{outline:2px solid var(--cyan);outline-offset:2px}
.paper-front .paper-message{display:block;margin-top:27px;padding:10px 12px;border-left:2px solid #99527e;background:#dcd7e2;color:#343044;font-size:11px;line-height:1.5;overflow-wrap:anywhere;max-height:105px;overflow:auto}
.draw-actions button{position:relative;overflow:hidden;isolation:isolate}
.draw-actions button>span,.draw-actions button>b{position:relative;z-index:2}
.draw-actions button:before{content:"";position:absolute;inset:0;z-index:0;background:linear-gradient(115deg,transparent 8%,#8deaf766 38%,#cfaaf488 51%,transparent 70%);clip-path:polygon(0 0,28% 0,77% 100%,49% 100%);transform:translateX(-145%);pointer-events:none}
.draw-actions button:not(:disabled):hover:before,.draw-actions button:not(:disabled):focus-visible:before{animation:draw-button-sweep .7s ease-out both}
@keyframes draw-button-sweep{to{transform:translateX(185%)}}
.draw-actions .draw-button-svg{position:absolute;right:8px;top:7px;width:70px;height:62px;z-index:1;fill:none;stroke:#acebf1;stroke-width:2;opacity:.45;pointer-events:none}
.draw-actions .draw-button-svg path{stroke-dasharray:100;stroke-dashoffset:70}
.draw-actions button:not(:disabled):hover .draw-button-svg path,.draw-actions button:not(:disabled):focus-visible .draw-button-svg path{animation:draw-chevron .65s ease-out forwards}
@keyframes draw-chevron{to{stroke-dashoffset:0;opacity:1}}
.stamp:not(:disabled):hover{box-shadow:0 13px 20px #0009,0 0 0 7px #a2497455,0 0 38px #eda2d7;animation:stamp-pulse 1.25s ease-in-out infinite alternate}
@keyframes stamp-pulse{to{filter:drop-shadow(0 0 18px #f2b4da)}}
.reveal-signal{filter:drop-shadow(0 0 8px #ad94ed55)}
.reveal-signal .reveal-glyph{stroke:#d7bcf2;stroke-width:2;stroke-dasharray:380;animation:reveal-glyph-flow 5s linear infinite}
@keyframes reveal-glyph-flow{to{stroke-dashoffset:-760}}
.reveal-shell[data-phase=sealed] .paper-back{animation:paper-drift-a 3.4s ease-in-out infinite alternate}
.reveal-shell[data-phase=sealed] .paper-mid{animation:paper-drift-b 3.9s ease-in-out infinite alternate}
@keyframes paper-drift-a{to{transform:translate(-29px,-18px) rotate(-10deg)}}
@keyframes paper-drift-b{to{transform:translate(19px,-15px) rotate(7deg)}}

/* Hidden five-star contracts signal their rarity before the seal is broken. */
.result-card.is-rare:not(.is-revealed):not(.is-connecting){animation:fly-in .7s both var(--stagger),rare-tremor 3.1s ease-in-out calc(.7s + var(--stagger)) infinite}
.result-card.is-rare .contract-back{border-color:#dfbb79;background:repeating-linear-gradient(0deg,#f0e9dd,#f0e9dd 18px,#e4dbc9 19px)}
.result-card.is-rare:not(.is-revealed) .contract-back{animation:rare-light 1.9s ease-in-out infinite alternate}
.result-card .rare-signal{position:absolute;inset:0;width:100%;height:100%;z-index:1;fill:none;stroke:#e9bf71;stroke-width:2;opacity:0;pointer-events:none;filter:drop-shadow(0 0 9px #ffda83)}
.result-card.is-rare:not(.is-revealed) .rare-signal{opacity:.88;animation:rare-svg-pulse 1.9s ease-in-out infinite alternate}
.result-card .rare-signal circle{stroke-dasharray:12 8}
.result-card .rare-signal .rare-core{stroke-width:3}
.result-card.is-rare.is-connecting{animation:document-shake .18s linear infinite,signal-glow .75s ease-in-out both}
.result-card.is-rare.is-connecting .rare-signal{opacity:1;animation:rare-burst .8s ease-out both}
.result-card.is-rare .connect-lines{stroke:#ffe3a3;stroke-width:3;filter:drop-shadow(0 0 10px #ffe092)}
.result-card .connect-lines circle,.result-card .connect-lines path{stroke-dasharray:220;stroke-dashoffset:220}
.result-card.is-connecting .connect-lines circle,.result-card.is-connecting .connect-lines path{animation:connect .75s ease-out forwards}
.result-card.is-revealed .rare-signal{opacity:0!important;animation:none!important}
.result-card.is-revealed{animation:none;opacity:1;transform:none}
@keyframes rare-light{0%{box-shadow:inset 0 0 9px #d4a954,0 0 10px #d4a954}100%{box-shadow:inset 0 0 28px #ffe5a5,0 0 28px #f6c75e}}
@keyframes rare-svg-pulse{to{opacity:1;stroke:#fff0b6;transform:scale(1.04)}}
@keyframes rare-burst{0%{transform:scale(.8);opacity:.4}50%{transform:scale(1.2);opacity:1}100%{transform:scale(1.55);opacity:0}}
@keyframes rare-tremor{0%,77%,90%,100%{transform:translateX(0)}79%,84%{transform:translateX(-4px) rotate(-.4deg)}81%,86%{transform:translateX(4px) rotate(.4deg)}}

@media(max-width:700px){.gacha-header nav{margin-right:0}.pool-tile,.pool-grid.single-pool .pool-tile{min-height:350px;padding:28px 26px}.pool-tile .tile-circuit{width:165px;height:165px;right:0;top:23%}.pool-tile .tile-file-side{right:12px;top:75px;bottom:22px}}
@media(prefers-reduced-motion:reduce){.pool-tile .tile-circuit,.pool-tile .tile-chevron-curtain,.draw-actions .draw-button-svg path,.reveal-shell[data-phase=sealed] .paper-back,.reveal-shell[data-phase=sealed] .paper-mid,.result-card.is-rare:not(.is-revealed):not(.is-connecting),.result-card.is-rare:not(.is-revealed) .contract-back,.result-card.is-rare:not(.is-revealed) .rare-signal{animation:none!important}}
