:root{--navy:#061329;--panel:#101e39;--line:#2c4765;--ink:#eaf6ff;--muted:#a7c0d7;--aqua:#70e1ff;--gold:#f3d398;color-scheme:dark;font-family:ui-sans-serif,system-ui,"Noto Sans TC",sans-serif;font-size:16px;background:#061329;color:var(--ink);--card-aspect:.718}*{box-sizing:border-box}html,body{margin:0;min-width:0}body{min-height:100vh;background:radial-gradient(circle at 85% 0%,#1b3661 0,transparent 32%),radial-gradient(circle at 0% 55%,#132c50 0,transparent 35%),var(--navy)}a{color:inherit}button,input,select,textarea{font:inherit}button,select,input[type=file],input:not([type=range]),textarea{min-height:44px}button,.button{border:1px solid #5684a8;border-radius:12px;background:#1b3958;color:#fff;padding:.7rem 1rem;cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;justify-content:center}button:hover,.button:hover{background:#265476}button.primary,.button.primary{background:linear-gradient(110deg,#1b83ac,#5457ba);border-color:#7ad8ee;font-weight:700}input,select,textarea{background:#0b1d35;color:#fff;border:1px solid #46647f;border-radius:10px;padding:.65rem;width:100%}input[type=range]{padding:0}label{display:block;margin:.9rem 0 .4rem;font-weight:650}small,.muted{color:var(--muted)}:focus-visible{outline:3px solid #8deaff;outline-offset:3px}[hidden]{display:none!important}.shell{max-width:1200px;margin:auto;padding:0 22px}.topbar{border-bottom:1px solid #29415c;background:#08172bd9}.topbar .shell{display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:72px}.brand{font-weight:850;white-space:nowrap;text-decoration:none;color:#eefbff}.brand span{color:var(--aqua)}nav{display:flex;gap:7px;flex-wrap:wrap}nav a{text-decoration:none;color:#bcd2e7;padding:10px 13px;border-radius:10px}nav a[aria-current=page],nav a:hover{background:#1b3b5e;color:white}main{min-height:calc(100vh - 170px);padding-top:38px;padding-bottom:48px}.eyebrow{letter-spacing:.2em;color:var(--aqua);font-weight:800;text-transform:uppercase;font-size:.75rem}.page-title{font-size:clamp(2rem,5vw,3.5rem);letter-spacing:-.045em;line-height:1.13;margin:.45rem 0 .7rem}.lead{color:var(--muted);line-height:1.75;max-width:64ch}.panel{border:1px solid var(--line);border-radius:22px;background:linear-gradient(150deg,#132541d9,#0c1930e8);padding:22px}.hero{display:grid;grid-template-columns:minmax(0,1fr) minmax(270px,390px);gap:40px;align-items:center;padding:40px 0 55px}.hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:25px}.hero-card{display:grid;place-items:center;min-height:480px;background:radial-gradient(circle,#21477077,transparent 68%)}.hero-card img{width:min(100%,340px);border-radius:5%;box-shadow:0 30px 70px #0008;transform:rotate(-6deg)}.stat-row{display:flex;gap:16px;flex-wrap:wrap;margin:24px 0}.stat{min-width:155px;padding:16px 20px;border:1px solid var(--line);border-radius:15px;background:#10223d}.stat strong{display:block;font-size:1.6rem;color:white}.builder-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:26px;align-items:start}.builder-preview{position:sticky;top:20px;order:2;text-align:center}.builder-form{order:1}.builder-preview .stage{width:min(100%,360px)}.stage{isolation:isolate}.stage .card__artwork{object-fit:contain}.stage .card__front{overflow:hidden;border-radius:4.5%}.stage .card__artwork{filter:saturate(var(--winnie-saturation,1)) contrast(var(--winnie-contrast,1)) brightness(var(--winnie-brightness,1))}.stage .card__glare,.stage .card__glare2{opacity:var(--winnie-glare,.65)}.stage .card__glitter{opacity:var(--winnie-sparkle,.6)}.stage .card[data-user-mask=true] .card__shine,.stage .card[data-user-mask=true] .card__shine:before,.stage .card[data-user-mask=true] .card__shine:after{-webkit-mask-image:var(--user-mask)!important;mask-image:var(--user-mask)!important;-webkit-mask-size:cover!important;mask-size:cover!important;mask-mode:var(--user-mask-mode,luminance)!important}.stage .card[data-user-foil=true] .card__shine,.stage .card[data-user-foil=true] .card__shine:before,.stage .card[data-user-foil=true] .card__shine:after{--foil:var(--user-foil)!important}.stage .card:not(.interacting) .card__shine,.stage .card:not(.interacting) .card__glare,.stage .card:not(.interacting) .card__glitter,.stage .card:not(.interacting) .card__glare2{visibility:visible;opacity:.11}.stage[data-quality=balanced] .card__glitter,.stage[data-quality=low] .card__glitter,.stage[data-quality=low] .card__glare2{display:none!important}.stage[data-quality=low] .card__shine{filter:none!important}.stage:focus-visible{outline:3px solid var(--aqua)}.field-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 14px}.field-grid>*{min-width:0}.wide{grid-column:1/-1}.range-field{display:grid;grid-template-columns:1fr 70px;gap:10px;align-items:center}.range-field label{grid-column:1/-1}.range-field output{text-align:right;color:var(--aqua)}details{border-top:1px solid var(--line);margin-top:20px;padding-top:16px}summary{cursor:pointer;font-weight:750}.form-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:22px}.status{min-height:1.5em;color:#b5f3d6}.status.error{color:#ffb4bc}.filters{display:grid;grid-template-columns:minmax(150px,2fr) repeat(3,minmax(125px,1fr)) minmax(120px,1fr);gap:10px;margin:26px 0}.filters select,.filters input{margin:0}.collection-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(205px,1fr));gap:20px}.tile{display:block;text-decoration:none;border:1px solid var(--line);border-radius:18px;background:#10213c;overflow:hidden;transition:transform .2s,border-color .2s}.tile:hover{transform:translateY(-5px);border-color:#8ceaff}.tile img{display:block;width:100%;aspect-ratio:3/4;object-fit:contain;background:#091629}.tile-info{padding:13px 15px}.tile-info strong{display:block}.tile-info small{display:block;margin-top:5px}.tile.locked img{filter:grayscale(1) brightness(.35)}.empty{padding:35px;text-align:center;color:var(--muted)}.viewer-layout{display:grid;grid-template-columns:minmax(0,1fr) 290px;gap:40px;align-items:center;min-height:560px}.viewer-stage{display:grid;place-items:center;padding:22px;background:radial-gradient(circle,#1e436b99,transparent 62%)}.viewer-stage .stage{width:min(100%,390px)}.viewer-meta h1{font-size:2.4rem;margin:.5rem 0}.viewer-meta .pill{display:inline-block;border:1px solid #6fa9c9;border-radius:99px;padding:5px 13px;color:#cceeff}.viewer-meta p{line-height:1.7}.viewer-links{display:flex;gap:10px;flex-wrap:wrap;margin-top:28px}.footer-container{border-top:1px solid #28435e;padding:23px 0 30px;display:flex;justify-content:space-between;gap:15px;flex-wrap:wrap;color:#abc2d8;font-size:.85rem}.winnie-badge{font-weight:800;color:#e9faff;transition:color .2s,transform .2s}.winnie-badge:hover,.winnie-badge:focus-visible{color:#ffe1aa;transform:translateY(-2px)}.footer-text{max-width:690px}.legal{font-size:.8rem;color:#9eb8cc;margin-top:8px}.legal a{color:#9ddfff}@media(max-width:850px){.builder-layout,.viewer-layout{grid-template-columns:1fr}.builder-preview{order:0;position:static}.builder-form{order:1}.viewer-layout{gap:8px}.filters{grid-template-columns:repeat(2,minmax(0,1fr))}.filters input{grid-column:1/-1}.hero{grid-template-columns:1fr}.hero-card{min-height:0}.hero-card img{max-width:280px}}@media(max-width:480px){.shell{padding:0 14px}.topbar .shell{align-items:flex-start;flex-direction:column;padding-top:13px;padding-bottom:10px;gap:5px}nav a{padding:9px}.panel{padding:16px}.field-grid{grid-template-columns:1fr}.wide{grid-column:auto}.builder-preview .stage,.viewer-stage .stage{width:min(100%,310px)}.filters{grid-template-columns:1fr}.filters input{grid-column:auto}.page-title{font-size:2rem}.hero{padding:12px 0 32px}.hero-card{display:none}.viewer-stage{padding:8px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation:none!important;transition:none!important}.stage .card__rotator{transform:none!important}.tile:hover,.winnie-badge:hover{transform:none}}
/* Local Winnie adaptations, 2026-09-30: adjustable parallax and optional SSR spectrum. */
.stage .card__artwork{transform:translate3d(var(--winnie-image-x,0px),var(--winnie-image-y,0px),0)}
.stage .card__glare{mask-image:radial-gradient(circle var(--winnie-glare-size,34%) at var(--pointer-x,50%) var(--pointer-y,50%),#000 20%,transparent 100%)}
.stage .card[data-winnie-profile="galaxy-rainbow-ssr"]{--clip:inset(0 round 4.5%)}
/* AI-001 is complete artwork. The upstream Cosmos art-window clip creates a
   visible rectangle here, so feather the optical layer across the full card. */
.stage .card[data-winnie-profile="galaxy-rainbow-ssr"] .card__shine{clip-path:inset(0 round 4.5%);-webkit-mask-image:radial-gradient(ellipse 95% 85% at var(--pointer-x,50%) var(--pointer-y,50%),#000 12%,transparent 100%);mask-image:radial-gradient(ellipse 95% 85% at var(--pointer-x,50%) var(--pointer-y,50%),#000 12%,transparent 100%);mix-blend-mode:screen;filter:brightness(.8) contrast(1.1) saturate(.9);opacity:calc(var(--card-opacity,.2) * .28)}
.stage .card[data-winnie-profile="galaxy-rainbow-ssr"] .card__shine:after{content:"";position:absolute;inset:0;background:conic-gradient(from 60deg at var(--pointer-x,50%) var(--pointer-y,50%),#ff4880aa,#56b6ffaa,#86ffee99,#fbe474aa,#ff4880aa);mix-blend-mode:soft-light;opacity:calc(var(--card-opacity,.2) * .28);pointer-events:none}