*{box-sizing:border-box}body{margin:0;background:#100e19;color:#f4eef5;font-family:"Malgun Gothic",system-ui,sans-serif}.fusion-header,body>main,.fusion-footer{max-width:1120px;margin:auto;padding:0 30px}.fusion-header{min-height:64px;gap:12px;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #30273f}.brand{color:inherit;text-decoration:none;font-weight:900;font-size:20px}.brand b,em,.kicker{color:#f9d67b}.brand small,.edition,.kicker,.display-heading{font-size:11px;letter-spacing:.15em}.brand small{margin-left:10px;color:#a59ab2}.edition{color:#e1c888}.intro{padding:43px 0 28px}.intro h1{font-size:clamp(48px,8vw,88px);letter-spacing:-.085em;line-height:1.03;margin:14px 0}.intro em{font-style:normal}.intro>p:last-child,.note{color:#bcb2c7;line-height:1.7}.studio{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px}.panel,.display{border:1px solid #453753;border-radius:22px;background:#1c1628;padding:26px}.panel{align-self:start}.panel h2,.gallery h2{margin:0 0 22px;font-size:27px}.ingredients{display:grid;gap:15px}.ingredients label{display:grid;gap:6px;color:#d4c5e3;font-size:13px;font-weight:700}.ingredients input{width:100%;background:#100e19;border:1px solid #4a3a5d;border-radius:10px;padding:12px;color:#fff;font:inherit}button,a,input{outline-offset:4px}button,a{touch-action:manipulation}button{cursor:pointer;font:inherit}.primary{margin-top:23px;width:100%;border:0;border-radius:12px;padding:14px;background:#f9d67b;color:#201529;font-weight:900}.note,#status{font-size:13px}#status{color:#f9d67b;line-height:1.6}.display{background:radial-gradient(ellipse at 50% 40%,#39244b,#191425 75%);text-align:center}.display-heading{display:flex;justify-content:space-between;color:#ccb2df;gap:8px}#card{width:min(100%,312px);aspect-ratio:5/7;display:block;margin:18px auto;object-fit:contain;filter:drop-shadow(0 15px 22px #090710cc)}.actions{display:flex;gap:8px;justify-content:center;flex-wrap:wrap}.actions a,.actions button{padding:9px 14px;border:1px solid #5c496a;border-radius:8px;color:#f4eef5;background:#21192e;text-decoration:none;font-size:13px}.gallery{margin:52px 0}.tiles{display:grid;grid-template-columns:repeat(3,1fr);gap:15px}.tiles button{min-width:0;background:#1c1628;border:1px solid #453753;color:#f4eef5;border-radius:14px;padding:13px;display:grid;gap:6px;text-align:left}.tiles img{width:100%;max-width:180px;justify-self:center}.tiles small{color:#bcb2c7;line-height:1.5}.fusion-footer{padding-bottom:30px;color:#a59ab2;font-size:12px}button:disabled{opacity:.65;cursor:wait}@media(max-width:640px){.fusion-header,body>main,.fusion-footer{padding-inline:18px}.studio{grid-template-columns:1fr}.panel,.display{padding:18px}.tiles{gap:8px}.tiles button{padding:7px;font-size:12px}.tiles small{font-size:10px}.brand small{display:none}}
/* The card is the collectible. The workshop around it is a quiet instrument panel. */
:root{color-scheme:dark;--muted:#bcb2c7;--gold:#f9d67b;--line:#493950;--mono:ui-monospace,"Cascadia Mono",monospace}
body{font-family:"Pretendard","Malgun Gothic","Apple SD Gothic Neo",system-ui,sans-serif;background:radial-gradient(ellipse at 70% 12%,#251932 0,transparent 42%),#100e19}
.edition,.kicker,.display-heading,.brand small,footer{font-family:var(--mono);font-weight:650}
.intro h1{font-weight:950;letter-spacing:-.09em}.intro>p:last-child{max-width:35rem}
.panel{position:relative;box-shadow:0 15px 50px #09071170}
.panel h2{padding-right:100px}.random{position:absolute;right:26px;top:51px}
.random,#retry{padding:7px 10px;border:1px solid #625071;border-radius:8px;background:#2a2038;color:#eee0fc;font-size:12px}
.odds{display:flex;flex-wrap:wrap;gap:8px;padding-top:13px;border-top:1px solid var(--line)}
.odds span{padding:6px 9px;background:#13101d;border:1px solid #493950;border-radius:7px;font-size:11px;color:#d9cae3}
.odds span:nth-child(2){color:var(--gold)}.odds span:nth-child(3){color:#ffad93}
.odds b{font-family:var(--mono);margin-left:2px}.primary:hover:not(:disabled){background:#ffe5a2}
#status:empty{display:none}#status{margin-bottom:8px}.display{position:relative;overflow:hidden;scroll-margin-top:16px}
#tag{padding:5px 9px;border-radius:6px;background:#221831;border:1px solid #584369}
.display-heading{align-items:center}.display[data-rarity=gold]{border-color:#c9a24e;background:radial-gradient(ellipse at 50% 42%,#563718,#201623 75%)}
.display[data-rarity=gold] #tag{color:#ffe3a1;border-color:#c9a24e;background:#382811}
.display[data-rarity=accident]{border-color:#bf6954;background:radial-gradient(ellipse at 50% 42%,#592f38,#201423 75%)}
.display[data-rarity=accident] #tag{color:#ffd0b6;border-color:#bf6954;background:#442029}
.display.working:after{content:"";position:absolute;inset:0 0 auto;height:3px;background:linear-gradient(90deg,transparent,#ffd985,transparent);animation:scan 1.7s ease-in-out infinite;pointer-events:none}
.display.revealed #card{animation:reveal .45s ease-out}
.tiles button:hover{border-color:#a78bbd;transform:translateY(-2px)}
button:focus-visible,a:focus-visible,input:focus-visible{outline:2px solid var(--gold)}
@keyframes scan{0%,100%{opacity:.25;transform:translateX(-35%)}50%{opacity:1;transform:translateX(35%)}}
@keyframes reveal{from{opacity:.3;transform:translateY(10px) scale(.97)}to{opacity:1;transform:none}}
@media(max-width:640px){.random{right:18px;top:44px}.intro{padding-top:30px}.display-heading{font-size:10px}.tiles button:hover{transform:none}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}
.tiles article{min-width:0;display:grid;align-content:start;gap:8px;padding:12px;border:1px solid #453753;border-radius:14px;background:#1c1628}
.tiles article .actions{justify-content:flex-start}.tiles article small{overflow-wrap:anywhere}
.fusion-header .edition { display:inline-flex; align-items:center; min-height:44px; text-align:right; letter-spacing:0; }
.fusion-footer { display:flex; flex-wrap:wrap; align-items:center; gap:10px 20px; }
.fusion-footer a { display:inline-flex; align-items:center; min-height:44px; color:#f9d67b; text-underline-offset:4px; }
.itland-project-nav { --paper:#181422; --text:#f4eef5; }
.fusion-header { display:grid; grid-template-columns:minmax(0,1fr) max-content; min-height:92px; padding-block:8px; gap:12px; }
.fusion-header .brand { display:block; width:min(100%,228px); min-width:0; }
.fusion-header .brand picture { display:block; }
.brand-logo { display:block; width:100%; height:auto; aspect-ratio:3/1; object-fit:contain; }
.fusion-header .edition { white-space:nowrap; justify-self:end; }
@media(max-width:640px) {
  .fusion-header { min-height:76px; }
  .fusion-header .brand { width:min(100%,186px); }
}
.generation-preparation { margin:32px 0 24px; padding:24px 0; border-block:1px solid var(--line); scroll-margin-top:24px; }
.generation-preparation[hidden],.fusion-banner[hidden] { display:none; }
.generation-preparation h2 { font-size:24px; margin:8px 0 14px; }
.generation-preparation p { max-width:66ch; overflow-wrap:anywhere; line-height:1.7; }
.preparation-actions { display:flex; flex-wrap:wrap; gap:12px; margin-top:20px; align-items:center; }
.preparation-actions .primary { width:min(100%,280px); min-height:48px; margin:0; }
.preparation-actions button:not(.primary) { min-height:44px; border:1px solid var(--line); padding:10px 14px; border-radius:8px; background:transparent; color:inherit; }
.fusion-banner { padding:24px 0; margin:0 0 32px; border-bottom:1px solid var(--line); text-align:center; }
.fusion-banner small { font:11px var(--mono); color:var(--muted); }
.fusion-banner-space { width:100%; min-height:116px; display:flex; align-items:center; justify-content:center; margin-top:8px; }
.fusion-banner .note { font-size:12px; }
@media(max-width:360px) { .fusion-banner-space { overflow:hidden; } }
#collection { grid-template-columns:repeat(3,minmax(0,1fr)); align-items:start; }
#collection .collection-card { gap:10px; padding:14px; align-content:start; border-radius:14px; }
.collection-preview { display:grid; place-items:center; width:100%; max-width:240px; aspect-ratio:5/7; justify-self:center; background:#14101d; border-radius:10px; overflow:hidden; }
#collection .collection-preview img { width:100%; max-width:none; height:auto; aspect-ratio:5/7; object-fit:contain; }
.collection-preview [hidden] { display:none; }
.preview-state { padding:16px; color:var(--muted); font-size:12px; text-align:center; line-height:1.6; }
.collection-card strong { font-size:16px; line-height:1.5; overflow-wrap:anywhere; }
.card-rarity { justify-self:start; padding:4px 8px; border:1px solid #665570; border-radius:6px; color:#d9cae3; font-size:12px; line-height:1.4; }
.collection-card[data-rarity=gold] { border-color:#9f803e; }
.collection-card[data-rarity=gold] .card-rarity { color:#ffe3a1; border-color:#9f803e; background:#382811; }
.collection-card[data-rarity=accident] { border-color:#ac6654; }
.collection-card[data-rarity=accident] .card-rarity { color:#ffd0b6; border-color:#ac6654; background:#442029; }
#collection .card-recipe { font-size:13px; line-height:1.7; overflow-wrap:anywhere; word-break:keep-all; }
@media(max-width:640px) {
  #collection { grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
  #collection .collection-card { padding:10px; gap:8px; }
  .collection-card strong { font-size:14px; }
  #collection .card-recipe { font-size:12px; }
}
@media(max-width:359px) { #collection { gap:8px; } #collection .collection-card { padding:8px; } }
