.rc-page {max-width:1100px}
.rc-page .breadcrumbs {display:flex;flex-wrap:wrap;gap:10px;font-size:12px;color:var(--text-2);margin:22px 0}
.rc-heading {margin:28px 0 26px}
.rc-heading h1 {font-size:clamp(26px,3.5vw,38px);letter-spacing:-1.3px;line-height:1.18;margin:0 0 12px}
.rc-heading p {color:var(--text-2);font-size:15px;max-width:65ch;line-height:1.7;margin:0}
.rc-generator {border:1px solid var(--border-strong);border-radius:var(--r-lg);background:var(--surface);overflow:hidden;padding:24px}
.rc-page button,.rc-page select {font:inherit}
.rc-controls {border-bottom:1px solid var(--border);padding-bottom:22px}
.rc-page fieldset {border:0;padding:0;margin:0;min-width:0}
.rc-page legend,.rc-match {font-size:12px;font-weight:600;color:var(--text-2);margin-bottom:10px}
.rc-segments {display:flex;gap:4px;padding:4px;background:var(--bg);border:1px solid var(--border);border-radius:12px;width:fit-content;max-width:100%}
.rc-segments label {position:relative;cursor:pointer;flex:1}
.rc-segments input {position:absolute;opacity:0;width:1px;height:1px}
.rc-segments span {display:block;padding:11px 18px;border-radius:8px;font-size:13px;white-space:nowrap;color:var(--text-2)}
.rc-segments input:checked+span {background:var(--surface-3);color:var(--text-1);box-shadow:0 1px 4px #0004}
.rc-segments input:focus-visible+span,.rc-page button:focus-visible,.rc-page select:focus-visible {outline:2px solid var(--accent);outline-offset:3px}
.rc-color-row {display:flex;flex-wrap:wrap;align-items:end;gap:20px;margin-top:18px}
.rc-color-buttons {display:flex;gap:7px;align-items:center}
.rc-color-buttons button {display:flex;align-items:center;justify-content:center;border:1px solid var(--border-strong);background:var(--surface-2);border-radius:50%;min-width:40px;height:40px;padding:7px;color:var(--text-2);cursor:pointer}
.rc-color-buttons button[data-colors] {border-radius:8px;padding:0 12px;font-size:12px}
.rc-color-buttons button[aria-pressed=true] {border-color:var(--accent);background:var(--accent-dim);color:var(--accent-soft)}
.rc-match {display:flex;flex-direction:column;gap:10px;margin:0}
.rc-match select {height:40px;color:var(--text-1);border:1px solid var(--border-strong);border-radius:8px;background:var(--surface-2);padding:0 10px;font-size:12px}
.rc-clear {margin-left:auto;font-size:12px!important;height:40px;padding:0 4px;background:none;border:0;color:var(--text-2);cursor:pointer}
.rc-status {font-size:12px;color:var(--text-2);text-align:center;margin:16px 0;min-height:18px}
.rc-result {min-height:475px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px}
.rc-card-stage {display:flex;justify-content:center;gap:24px;width:100%;max-width:640px}
.rc-card {margin:0;min-width:0;flex:1;max-width:245px;text-align:center}
.rc-card button {padding:0;background:none;border:0;width:100%;color:inherit;cursor:pointer}
.rc-card img {display:block;width:100%;height:auto;aspect-ratio:488/680;object-fit:contain;border-radius:12px;box-shadow:0 12px 28px #0007}
.rc-card figcaption {font-size:15px;font-weight:700;line-height:1.45;margin-top:12px;overflow-wrap:anywhere}
.rc-card small {display:block;font-size:11px;font-weight:400;color:var(--text-2);margin-top:4px}
.rc-identity {display:flex;align-items:center;justify-content:center;gap:8px;font-size:12px;color:var(--text-2);flex-wrap:wrap}
.rc-identity img {height:21px;width:21px}
.rc-pair-reason {text-align:center;max-width:60ch;margin:0;font-size:12px;line-height:1.6;color:var(--text-2)}
.rc-family {color:var(--accent-soft);font-size:12px;font-weight:600}
.rc-actions {display:flex;justify-content:center;gap:10px;flex-wrap:wrap;margin-top:20px}
.rc-actions button {display:flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:11px 19px;border:1px solid var(--border-strong);border-radius:9px;color:var(--text-1);background:var(--surface-2);font-size:13px;font-weight:600;cursor:pointer}
.rc-actions .rc-primary {background:var(--accent);color:#171309;border-color:var(--accent)}
.rc-actions button:disabled {opacity:.4;cursor:default}
.rc-actions button:hover:not(:disabled) {filter:brightness(1.12)}
.rc-method-hint {text-align:center;margin:14px 0 0;color:var(--text-2);font-size:11px;line-height:1.6}
.rc-loading {height:340px;width:244px;border-radius:12px;background:var(--surface-2)}
.rc-card-stage {position:relative;isolation:isolate;perspective:1100px}
.rc-card-stage::before {content:"";position:absolute;inset:-20px 4% 22%;z-index:-1;background:radial-gradient(ellipse,rgba(201,168,76,.15),transparent 65%);opacity:0;pointer-events:none}
.rc-card {--deal-x:-18px;--deal-turn:-5deg;perspective:900px}
.rc-card:nth-child(2) {--deal-x:18px;--deal-turn:5deg}
.rc-card button {position:relative;border-radius:12px;overflow:hidden;transform:perspective(1100px) translate(var(--db-hover-x,0px),var(--db-hover-y,0px)) rotateX(var(--deck-holo-rotate-x,0deg)) rotateY(var(--deck-holo-rotate-y,0deg));transition:transform 100ms ease-out;transform-style:preserve-3d;will-change:auto}
.rc-card button img {transform:none;filter:none}
.rc-deal-sheen {position:absolute;inset:-45% -60%;z-index:3;background:linear-gradient(110deg,transparent 38%,rgba(255,240,184,.25) 48%,rgba(255,255,255,.3) 50%,transparent 62%);transform:translateX(-85%);opacity:0;pointer-events:none}
.rc-result.is-revealing .rc-card {animation:rc-deal 420ms cubic-bezier(.16,1,.3,1) both}
.rc-result.is-revealing .rc-card:nth-child(2) {animation-delay:65ms}
.rc-result.is-revealing .rc-deal-sheen {animation:rc-glint 580ms 120ms ease-out both}
.rc-result.is-revealing .rc-card:nth-child(2) .rc-deal-sheen {animation-delay:185ms}
.rc-result.is-revealing .rc-card-stage::before {animation:rc-light 600ms ease-out both}
.rc-result.is-revealing .rc-identity,.rc-result.is-revealing .rc-family {animation:rc-caption 280ms 160ms ease-out both}
@keyframes rc-deal {0%{opacity:.1;transform:translate3d(var(--deal-x),22px,-35px) rotateZ(var(--deal-turn)) rotateY(-16deg) scale(.95)}60%{opacity:1;transform:translate3d(0,-3px,0) rotateZ(1deg) rotateY(0) scale(1.01)}100%{opacity:1;transform:none}}
@keyframes rc-glint {0%{opacity:0;transform:translateX(-85%) rotate(-8deg)}20%{opacity:.8}85%{opacity:.4}100%{opacity:0;transform:translateX(85%) rotate(-8deg)}}
@keyframes rc-light {0%{opacity:0;transform:scale(.75)}45%{opacity:1}100%{opacity:0;transform:scale(1.15)}}
@keyframes rc-caption {from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}
.rc-segments span,.rc-color-buttons button {transition:background-color 160ms ease,border-color 160ms ease,color 160ms ease}
.rc-actions button {transition:transform 150ms ease,filter 150ms ease}
.rc-actions button:active:not(:disabled) {transform:scale(.97)}
.rc-actions svg {width:17px;height:17px;display:block}
.rc-history button {transition:border-color 150ms ease,transform 150ms ease}
@media(hover:hover) and (pointer:fine){.rc-history button:hover{transform:translateY(-3px);border-color:var(--accent)}}
.rc-history-section {margin:28px 0 36px}
.rc-section-heading {display:flex;align-items:center;justify-content:space-between;gap:15px;margin-bottom:14px}
.rc-page h2 {font-size:18px;letter-spacing:-.4px;margin:0 0 16px}
.rc-section-heading h2 {margin:0;font-size:16px}
.rc-section-heading span {font-size:11px;color:var(--text-2)}
.rc-history {display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px}
.rc-history>p {grid-column:1/-1;color:var(--text-2);font-size:13px}
.rc-history button {background:var(--surface);border:1px solid var(--border);border-radius:10px;padding:10px;color:var(--text-2);font-size:11px;line-height:1.5;text-align:left;cursor:pointer;overflow-wrap:anywhere}
.rc-history button[aria-current=true] {border-color:var(--accent)}
.rc-history-art {display:flex;gap:4px;justify-content:center;margin-bottom:8px;height:92px}
.rc-history img {height:100%;width:auto;max-width:48%;object-fit:contain;border-radius:4px}
.rc-history-art:has(img:only-child) img {max-width:100%}
.rc-help,.rc-faq {margin:30px 0}
.rc-page details {border-bottom:1px solid var(--border);padding:16px 0}
.rc-page summary {font-size:14px;font-weight:600;cursor:pointer;line-height:1.5}
.rc-page details p {max-width:80ch;font-size:13px;line-height:1.85;color:var(--text-2);margin:14px 0 0}
.rc-page details a {color:var(--accent-soft)}
.rc-related {margin:34px 0}
.rc-related>div {display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.rc-related a {display:flex;flex-direction:column;padding:18px;border:1px solid var(--border);border-radius:10px;background:var(--surface);color:var(--text-1);text-decoration:none;font-size:13px;gap:7px}
.rc-related span {color:var(--text-2);font-size:12px}
#rc-share-fallback {max-width:600px;margin:16px auto;font-size:12px}
#rc-share-link {width:100%;background:var(--surface-2);color:var(--text-1);border:1px solid var(--border-strong);padding:12px;margin-top:8px}
.card-hover-oracle {white-space:pre-wrap;font-size:12px;line-height:1.6;color:var(--text-2);max-height:190px;overflow:auto;margin:8px 0}
.rc-page~.card-hover-layer,.card-hover-layer:has(.card-hover-oracle) {max-height:calc(100dvh - 24px);overflow:auto}
.card-hover-controls {display:flex;gap:8px;margin:10px 0}
.card-hover-controls button {background:var(--surface-2);color:var(--text-1);border:1px solid var(--border-strong);padding:8px;border-radius:6px;cursor:pointer}
@media(max-width:767px){.rc-generator{padding:16px}.rc-segments{width:100%}.rc-segments span{padding:11px 8px;font-size:11px;text-align:center;white-space:normal}.rc-color-row{gap:16px}.rc-color-buttons{gap:5px;flex-wrap:wrap}.rc-color-buttons button{min-width:36px;width:36px;height:40px}.rc-color-buttons button[data-colors]{width:auto}.rc-match{flex:1}.rc-clear{margin-left:0}.rc-card-stage{gap:12px}.rc-card{max-width:220px}.rc-card figcaption{font-size:12px}.rc-result{min-height:390px;gap:12px}.rc-actions button{padding:11px 13px;font-size:12px}.rc-history{grid-template-columns:repeat(3,minmax(0,1fr))}.rc-related>div{grid-template-columns:1fr}.rc-heading{margin-top:22px}.rc-page h1{letter-spacing:-.7px}.rc-history-art{height:85px}}
@media(max-width:420px){.rc-generator{padding:14px}.rc-color-buttons{gap:4px}.rc-color-buttons button{min-width:34px;width:34px}.rc-color-buttons button[data-colors]{padding:0 8px}.rc-result{min-height:360px}.rc-actions{gap:8px}.rc-actions .rc-primary{flex-basis:100%}.rc-actions button:not(.rc-primary){flex:1}.rc-section-heading span{max-width:90px;text-align:right}.rc-history button{padding:8px}}
@media(prefers-reduced-motion:reduce){.rc-result.is-revealing .rc-card,.rc-result.is-revealing .rc-deal-sheen,.rc-result.is-revealing .rc-card-stage::before,.rc-result.is-revealing .rc-identity,.rc-result.is-revealing .rc-family{animation:none}.rc-card button{transform:none!important}.rc-actions button,.rc-history button,.rc-segments span,.rc-color-buttons button,.card-hover-layer{transition:none}.rc-history button:hover{transform:none}}
@media(prefers-reduced-motion:reduce),(hover:none),(pointer:coarse){.rc-card button.foil-card-frame,.rc-card button.foil-card-frame img{transform:none;filter:none}.rc-card button.foil-card-frame::before,.rc-card button.foil-card-frame::after{display:none}}