:root{font-family:'DM Sans',sans-serif;color:#ece8df;background:#101a20;font-synthesis:none}*{box-sizing:border-box}body{margin:0}button,input,select,textarea{font:inherit}button,a,input,select,textarea{touch-action:manipulation}button{cursor:pointer}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible{outline:3px solid #dcbe82;outline-offset:3px}[hidden]{display:none!important}header{height:70px;display:flex;align-items:center;justify-content:space-between;padding:0 32px;border-bottom:1px solid #ffffff15;background:#10191e}a{color:inherit;text-decoration:none}.back{font-size:13px;color:#b6c2c7}.brand{font-family:Cinzel,Georgia,serif;font-weight:700;letter-spacing:4px;font-size:22px}.edition,.eyebrow{font-size:10px;letter-spacing:2px;font-weight:700;color:#c3a978}main{height:calc(100dvh - 70px);min-height:640px;display:grid;grid-template-columns:minmax(0,1fr) minmax(360px,480px);max-width:1500px;margin:auto}.preview{min-width:0;min-height:0;display:flex;flex-direction:column;align-items:center;padding:20px;background:radial-gradient(ellipse at 45% 40%,#31484c 0,transparent 65%);position:relative}.intro{position:absolute;top:30px;left:30px;max-width:200px;z-index:1;pointer-events:none}h1{font:500 clamp(23px,2.2vw,35px)/1.2 Cinzel,Georgia,serif;margin:12px 0}h1 em{color:#d8bd84;font-style:normal}.card-wrap{min-height:0;flex:1;width:100%;display:flex;align-items:center;justify-content:center;padding:8px}.card{--primary:#193c52;--accent:#d2b574;--glow:#60d6ff;--ink:#fff;aspect-ratio:5/7;height:100%;max-height:720px;max-width:100%;container-type:inline-size;display:flex;flex-direction:column;position:relative;overflow:hidden;border-radius:4%;padding:3%;background:var(--primary);box-shadow:0 20px 45px #0008,0 0 0 1px #d2b57466;border:5px solid #25313b;color:var(--ink);isolation:isolate}.card-wrap{padding-left:clamp(0px,9vw,130px)}.card-top{display:flex;justify-content:space-between;align-items:center;font-size:2cqw;letter-spacing:.14em;position:relative;z-index:2;height:4%;flex-shrink:0}.nameplate{height:10%;display:flex;flex-direction:column;justify-content:center;position:relative;z-index:2}.nameplate h2{font:700 5.3cqw/1.05 Cinzel,Georgia,serif;white-space:nowrap;margin:0;letter-spacing:-.025em}.nameplate>span{font-size:2.65cqw;margin-top:1%}.art{position:relative;flex:1;min-height:0;overflow:hidden;border:2px solid var(--accent);background:#14272c}.art img{position:absolute;width:100%;height:100%}.art-ambient{object-fit:cover;filter:blur(18px) brightness(.6);transform:scale(1.1)}#artwork{object-fit:contain;object-position:50% 50%}.ability{padding:3% 3% 2%;min-height:18%;background:#f5eedc;color:#222e35;position:relative;z-index:2}.ability-heading{display:flex;align-items:center;gap:3%;font-size:3.7cqw}.ability-heading strong{flex:1;overflow-wrap:anywhere}.sigil{color:var(--primary);font-size:5cqw}#powerBadge{font-weight:700;border-left:1px solid #22334444;padding-left:4%;font-size:4cqw}.ability p{font-size:2.85cqw;line-height:1.4;margin:2% 0 3%;overflow-wrap:anywhere}#stats{display:flex;gap:8%;font-size:1.9cqw;letter-spacing:.09em;border-top:1px solid #22334433;padding-top:2%}#stats b{font-size:2.5cqw}.card-foot{display:flex;justify-content:space-between;padding-top:2%;font-size:1.7cqw;letter-spacing:.13em;min-height:4%;align-items:center}.watermark{position:absolute;top:48%;left:0;width:100%;text-align:center;transform:rotate(-26deg);color:#fff7;font-size:4cqw;letter-spacing:.1em;pointer-events:none;text-shadow:0 1px 3px #0008;z-index:3}.ornament{position:absolute;inset:1.4%;border:1px solid var(--accent);pointer-events:none;border-radius:2%}.kindred .nameplate{border-bottom:3px solid var(--accent);margin-bottom:2%}.kindred .art{border-radius:8% 8% 0 0}.kindred .ability{border-radius:0 0 10% 0}.tide{background:linear-gradient(140deg,var(--primary) 60%,var(--accent));border-color:#11222e}.tide .nameplate h2{font-family:'DM Sans',sans-serif;font-style:italic;font-weight:700}.tide .nameplate{padding-left:3%;border-left:7px solid var(--accent);margin:1% 0 3%;height:9%}.tide .art{clip-path:polygon(0 0,93% 0,100% 6%,100% 100%,0 100%);border:0}.tide .ability{margin-top:-3%;clip-path:polygon(0 8%,100% 0,100% 100%,0 100%);padding-top:6%;background:#f8f5ed}.rune{background:radial-gradient(ellipse at top,var(--primary),#14121f);border-color:#2c2534}.rune .nameplate{text-align:center}.rune .art{border-radius:42% 42% 2% 2%;box-shadow:0 0 12px var(--glow);margin-top:2%}.rune .ability{background:linear-gradient(100deg,#eee1c6,#fcf5e4);border:2px solid var(--accent);margin-top:2%}.rune .ornament{border:3px double var(--accent)}.rune .card-top{border-bottom:1px solid var(--accent)}.fable{background:linear-gradient(150deg,#faf4e6 0%,var(--accent) 100%);color:#20313c;border-color:var(--primary)}.fable .nameplate{order:3;background:var(--primary);color:var(--ink);padding:2% 4%;height:10%;margin-top:-1%;border-radius:0 0 12px 12px}.fable .art{order:2;border-radius:20% 2% 20% 2%;border:3px double var(--primary);margin-top:1%}.fable .card-top{order:1}.fable .ability{order:4;background:transparent;padding-top:2%;min-height:17%}.fable .card-foot{order:5}.fable .ornament{border-color:var(--primary)}#safeZone{position:absolute;inset:10%;border:2px dashed #fcdd80;z-index:4;background:#ffd70008}#safeZone span{position:absolute;bottom:0;background:#18232cee;color:#fff;padding:4px;font-size:2.5cqw}.preview-tools{display:flex;gap:10px;margin-top:12px}.preview-tools button{background:#ffffff09;color:#ded9cd;border:1px solid #ffffff22;border-radius:99px;padding:9px 16px;font-size:12px}.preview-caption{font-size:11px;color:#acb8bb;margin:10px 0 0}.editor{background:#f8f6f0;color:#243535;display:flex;flex-direction:column;min-height:0;min-width:0;border-left:1px solid #fff2}.editor-heading{display:flex;align-items:center;justify-content:space-between;padding:26px 25px 20px}.editor-heading h2{font:600 22px/1.2 Cinzel,Georgia,serif;margin:7px 0 0}.editor-heading .eyebrow{color:#7c6241}.prototype{font-size:10px;border:1px solid #d6d6c8;padding:6px;border-radius:5px;color:#62716a}.tabs{display:flex;padding:0 16px;border-bottom:1px solid #dcded4;gap:3px}.tabs button{background:none;border:0;border-bottom:3px solid transparent;padding:14px 7px;color:#66756b;font-size:13px;flex:1;white-space:nowrap}.tabs button[aria-pressed=true]{border-color:#345544;color:#173b2a;font-weight:700}.panels{padding:24px;overflow:auto;min-height:0;flex:1;overscroll-behavior:contain}.tab-panel h3{font-size:19px;margin:0 0 8px}.muted,.note p,details p{font-size:13px;color:#63716b;line-height:1.55}.style-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:20px 0}.style-choice{text-align:left;padding:9px;border:1px solid #d7dacf;border-radius:12px;background:white;color:#253930}.style-choice[aria-pressed=true]{border:2px solid #356447;padding:8px;background:#edf2e5}.style-choice strong{display:block;font-size:14px;margin:9px 2px 4px}.style-choice small{display:block;margin:0 2px 5px;color:#657567;line-height:1.4;font-size:11px}.mini{height:105px;border:5px solid #1b3a4b;background:linear-gradient(25deg,#23495a,#122a40);position:relative;overflow:hidden;border-radius:6px}.mini img{height:100%;width:100%;object-fit:cover;object-position:50% 30%}.mini:after{content:'';position:absolute;bottom:0;left:0;right:0;height:19%;background:#efdfbb;border-top:3px solid #c5a56b}.mini.tide-mini{border-color:#176176;transform:skewY(-2deg)}.mini.tide-mini:after{clip-path:polygon(0 20%,100% 0,100% 100%,0 100%)}.mini.rune-mini{border:5px double #c3a16b;border-radius:40% 40% 4px 4px}.mini.fable-mini{border-color:#e6d6af;border-radius:25% 4px 25% 4px}.note{border:1px solid #dce0d3;padding:15px;background:#eeefe6;border-radius:10px;margin:18px 0}.note b{font-size:13px}.note p{margin:6px 0 0}label{display:flex;flex-direction:column;gap:7px;font-size:13px;font-weight:600;margin:15px 0}input:not([type=checkbox]):not([type=range]):not([type=color]),select,textarea{min-width:0;width:100%;border:1px solid #ced5c9;background:#fff;color:#243a30;border-radius:8px;padding:11px;font-size:16px}input[type=range]{accent-color:#356447;width:100%}.consent{flex-direction:row;align-items:flex-start;font-size:12px;line-height:1.5}.consent input{width:18px;height:18px;flex-shrink:0;accent-color:#356447}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 12px}details{border-top:1px solid #d9ddcf;margin-top:20px;padding-top:16px}summary{cursor:pointer;font-size:13px;color:#405d4b}pre{white-space:pre-wrap;font-size:12px;line-height:1.6;color:#4c6153}details button{border:1px solid #c6d0bf;background:white;padding:10px;border-radius:8px}.editor-footer{padding:16px 24px;border-top:1px solid #dcded4;display:flex;align-items:center;justify-content:space-between;gap:14px;background:#f8f6f0}.editor-footer span{font-size:11px;color:#617265}.editor-footer button{background:#234c38;color:#fff;border:0;border-radius:9px;padding:13px 18px;font-weight:600;white-space:nowrap}.swatches{display:flex;flex-wrap:wrap;gap:8px}.swatches button{height:32px;width:32px;border-radius:50%;border:2px solid #ffffff;box-shadow:0 0 0 1px #c4cabc}.swatches button[aria-pressed=true]{outline:2px solid #243b2c;outline-offset:2px}.color-row{display:flex;align-items:center;gap:12px;margin:14px 0 22px}.color-row input{width:48px;height:38px;border:1px solid #b5c5b7;border-radius:6px;background:white}.color-row span{font-size:12px;color:#627568}.color-block{border-bottom:1px solid #dee2d6;padding-bottom:10px}.expanded main{grid-template-columns:1fr}.expanded .editor,.expanded .intro{display:none}.expanded .card-wrap{padding-left:0}
@media(max-width:1150px){.intro{position:static;text-align:center;max-width:none}.intro h1{font-size:23px;margin:6px}.intro h1 br{display:none}.card-wrap{padding-left:0}.intro .eyebrow{font-size:9px}.card{max-height:620px}.editor-heading{padding:18px}.edition{display:none}}
@media(max-width:960px){header{height:52px;padding:0 14px}.brand{font-size:17px;letter-spacing:2px}.back{font-size:11px}main{height:calc(100dvh - 52px);min-height:560px;display:grid;grid-template-columns:1fr;grid-template-rows:44% 56%}.preview{padding:8px}.intro{display:none}.card-wrap{padding:0}.card{padding:2.5%;border-width:3px}.preview-tools{position:absolute;right:10px;bottom:30px;flex-direction:column;gap:6px}.preview-tools button{padding:8px;font-size:10px;background:#14232eee}.preview-caption{font-size:9px;margin:5px 0}.editor{border-left:0;border-top:1px solid #ffffff22}.editor-heading{display:none}.tabs{padding:0 8px}.tabs button{padding:12px 3px;font-size:12px;min-height:44px}.panels{padding:16px}.editor-footer{padding:10px 16px}.editor-footer button{padding:10px 13px;font-size:12px}.style-grid{gap:10px;margin:14px 0}.mini{height:95px}.expanded main{grid-template-rows:1fr}.expanded .preview-tools{position:static;flex-direction:row}.expanded .preview-caption{margin:8px}.swatches button{height:36px;width:36px}}

@media(max-width:960px){.preview-tools{position:static;flex-direction:row;margin-top:7px;flex-shrink:0}.preview-tools button{min-height:34px;padding:7px 13px}.preview-caption{flex-shrink:0}.card-wrap{overflow:hidden}}
/* Keep a true trading-card ratio even when tablet columns constrain width. */
.card-wrap{container-type:size}
.card{height:auto;width:min(100cqw,71.42857cqh,514px);max-height:none;flex-shrink:0;padding:2cqw}
@media(max-width:960px){.card{padding:2cqw}}
/* Art-first fronts: all detail copy lives on the reverse. */
.card{padding:0;border:2px solid var(--primary);border-radius:3%;background:var(--primary)}
.card .art{position:absolute;inset:0;margin:0;border:0;border-radius:0;clip-path:none;box-shadow:none;z-index:0}
.card .art:after{content:'';position:absolute;inset:60% 0 0;background:linear-gradient(transparent,#07151adb);pointer-events:none}
.card .ornament{inset:2%;border:1px solid var(--accent);border-radius:2%;z-index:2;opacity:.65}
.card .card-top{position:absolute;top:4%;left:5%;right:5%;height:auto;border:0;color:#fff;font-size:2cqw;text-shadow:0 1px 4px #000}
.card .nameplate{position:absolute;left:6%;right:6%;bottom:6%;height:auto;min-height:8%;padding:0;margin:0;border:0;border-radius:0;background:transparent;color:#fff;text-align:left;text-shadow:0 2px 8px #000}
.card .nameplate h2{font-family:'DM Sans',sans-serif;font-weight:700;white-space:normal;overflow-wrap:anywhere;line-height:1.05}
.card .nameplate>span{font-size:2.8cqw;line-height:1.2}
.card .ability{display:none}
.card .card-foot{position:absolute;bottom:2.5%;left:6%;right:6%;min-height:0;padding:0;color:#fff;font-size:1.65cqw;z-index:3;text-shadow:0 1px 4px #000}
.card .watermark{font-size:4cqw;top:47%}
.corner-stats{position:absolute;inset:9% 5% auto;display:flex;justify-content:space-between;z-index:4;pointer-events:none}
.stat-circle{width:12cqw;height:12cqw;border-radius:50%;background:var(--primary);color:var(--ink);border:1.5px solid var(--accent);display:flex;flex-direction:column;align-items:center;justify-content:center;box-shadow:0 2px 8px #0005}
.stat-circle b{font-size:4.3cqw;line-height:1}.stat-circle span{font-size:1.65cqw;margin-top:5%;letter-spacing:.01em;text-transform:uppercase}
.prism .ornament{clip-path:polygon(0 0,35% 0,35% 1%,1% 1%,1% 99%,65% 99%,65% 100%,0 100%);border:3px solid var(--accent)}
.prism .nameplate{border-left:3px solid var(--accent);padding-left:3%}
.impact .ornament{inset:0;border:0;background:linear-gradient(130deg,var(--accent) 0 2%,transparent 2% 97%,var(--accent) 97%);opacity:1;clip-path:none}
.impact .nameplate h2{font-style:italic;text-transform:uppercase;letter-spacing:-.04em}
.impact .nameplate{border-bottom:3px solid var(--accent);padding-bottom:2%;transform:rotate(-2deg)}
.vista .ornament{display:none}.vista .nameplate{text-align:center}.vista .card-top .collection-mark{letter-spacing:.3em}
.kindred .ornament{border-width:2px;border-radius:5%}.kindred .nameplate h2{font-family:Cinzel,serif}
.tide .nameplate{border-left:4px solid var(--accent);padding-left:3%}.tide .ornament{clip-path:polygon(0 0,90% 0,100% 8%,100% 100%,0 100%)}
.rune .ornament{border:3px double var(--accent);border-radius:40% 40% 2% 2%;opacity:.65}.rune .nameplate h2{font-family:Cinzel,serif}.rune .nameplate{text-align:center}
.fable .ornament{border-radius:20% 2% 20% 2%;border-color:var(--accent)}.fable .nameplate h2{font-family:Cinzel,serif}
.card-back{display:none;position:absolute;inset:0;padding:8%;color:var(--ink);background:radial-gradient(circle at 90% 0%,color-mix(in srgb,var(--accent) 25%,transparent),transparent 55%),var(--primary);z-index:5;flex-direction:column}
.card[data-side=back]>:not(.card-back):not(.watermark){display:none!important}.card[data-side=back] .card-back{display:flex}.card[data-side=back] .watermark{z-index:6;opacity:.25}
.back-brand{font-size:2cqw;letter-spacing:.14em}.back-symbol{font-size:16cqw;line-height:1.2;color:var(--accent);margin-top:6%}
.card-back h2{font:700 7cqw/1.1 'DM Sans',sans-serif;margin:5% 0 2%;overflow-wrap:anywhere}.card-back>p{font-size:3.5cqw;margin:0 0 8%;overflow-wrap:anywhere}
.back-story{border-top:1px solid var(--accent);padding-top:6%}.back-story>span{font-size:2cqw;letter-spacing:.18em}.back-story h3{font-size:5cqw;margin:5% 0 3%;overflow-wrap:anywhere}.back-story p{font-size:3.6cqw;line-height:1.5;overflow-wrap:anywhere;margin:0}
#backStats{display:flex;flex-wrap:wrap;gap:4%;font-size:2.7cqw;border-top:1px solid var(--accent);margin-top:auto;padding-top:5%}.back-edition{font-size:2cqw;letter-spacing:.16em;margin-top:6%}
.mini{height:150px;border-width:2px}.mini img{object-fit:cover;object-position:center}.mini:after{height:12%;background:linear-gradient(transparent,#102432);border:0}.mini.prism-mini{border-color:#63deee}.mini.impact-mini{border-color:#ffb15f;transform:rotate(-1deg)}.mini.vista-mini{border-color:#183f42}.mini.rune-mini{border-radius:6px}.mini.fable-mini{border-radius:6px}
@media(max-width:960px){.mini{height:135px}.preview-tools{gap:6px}.preview-tools button{padding:7px 10px}.card{padding:0;border-width:2px}}

/* Finish is independent of collection, colors, and front/back choice. */
.finish-picker{border:1px solid #d6ddcf;border-radius:12px;padding:14px;margin:18px 0 24px;min-width:0}.finish-picker legend{font-size:14px;font-weight:700;padding:0 6px}.finish-options{display:grid;grid-template-columns:1fr 1fr;gap:10px}.finish-option{position:relative;display:flex;margin:0;gap:7px;padding:10px;border:2px solid transparent;border-radius:9px;background:#fff;cursor:pointer}.finish-option:has(input:checked){border-color:#356447;background:#edf2e5}.finish-option input{position:absolute;top:12px;right:10px;accent-color:#356447;width:17px;height:17px}.finish-option strong{font-size:13px;padding-right:4px}.finish-option small{font-size:11px;font-weight:400;line-height:1.4;color:#546759}.finish-swatch{width:48px;height:38px;border-radius:7px;background:#224c66;border:1px solid #32475533}.shimmer-swatch{background:linear-gradient(125deg,#214768,#a1d8dc,#e8addb,#f2dfa4,#9de3df,#537daf)}.finish-note{font-size:11px;color:#405e4e;line-height:1.5;margin:12px 0 0}.finish-picker>.muted{font-size:11px;margin-bottom:0}.finish-caption{font-size:11px;color:#dec694;margin:8px 0 0;flex-shrink:0}.finish-caption+.preview-caption{margin-top:4px}
.card[data-finish=shimmer] .art:before{content:'';position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(115deg,transparent 5%,#61d9fc55 20%,#df8dff88 32%,#fff2aa88 43%,#9cffe477 55%,transparent 68%);background-size:250% 250%;background-position:0% 50%;mix-blend-mode:screen;opacity:.6;animation:card-shimmer 7s ease-in-out infinite alternate}
.card[data-motion=off] .art:before{animation:none;background-position:45% 50%}
@keyframes card-shimmer{from{background-position:0% 45%}to{background-position:100% 55%}}
@media(prefers-reduced-motion:reduce){.card[data-finish=shimmer] .art:before{animation:none;background-position:45% 50%}}
@media(max-width:960px){.finish-caption{font-size:10px;margin-top:5px}.finish-picker{padding:10px}.finish-option{padding:9px}}

.reset-colors{min-height:44px;padding:10px 16px;border:1px solid #b7c6b4;border-radius:8px;background:#fff;color:#234c38;font-weight:600}.reset-colors:hover{background:#edf2e5}.reset-help{margin:8px 0 18px;font-size:12px}
.instant-builder{padding:15px;border:1px solid #bed2bb;background:#edf3e8;border-radius:12px;margin:18px 0}.builder-heading{display:flex;align-items:center;justify-content:space-between;gap:12px}.instant-builder button{min-height:44px;border:1px solid #b6c8b3;border-radius:8px;padding:10px 14px;background:#234c38;color:#fff;font-weight:600}.instant-builder .text-button{min-height:0;padding:0;border:0;background:none;color:#234c38;text-decoration:underline}.instant-builder #leaveBuilder{background:white;color:#234c38}.instant-builder label{margin:10px 0}.instant-builder #builderMessage{font-size:12px}#builderStage{position:absolute;pointer-events:none;overflow:hidden;z-index:0}#builderStage .builder-base{inset:0;width:100%;height:100%}#builderStage .builder-animal{position:absolute;object-fit:contain;left:65%;top:45%;width:32%;height:47%;filter:drop-shadow(0 3px 3px #00102277)}#builderStage .builder-animal[data-animal=fox]{top:58%;height:34%;width:32%}#builderStage .builder-weapon{position:absolute;object-fit:contain;left:5%;top:4%;width:29%;height:21%;transform:rotate(-9deg);transform-origin:65% 100%}#builderStage .builder-weapon[data-weapon=staff]{left:11%;top:3%;width:20%;height:22%}.companion-shadow{position:absolute;left:66%;top:88%;width:29%;height:5%;border-radius:50%;background:#06111fbf;filter:blur(5px)}#builderMagic{position:absolute;inset:0;width:100%;height:100%;color:var(--glow);filter:drop-shadow(0 0 5px var(--glow))}#builderMagic[data-magic=none]{display:none}#builderMagic[data-magic=stars] .lightning-effects,#builderMagic[data-magic=lightning] .star-effects{display:none}#builderStage[data-companion=none] #builderMagic .lightning-effects path:last-child{display:none}.card[data-builder=on] #artwork,.card[data-builder=on] .art-ambient{visibility:hidden}
/* Anchor feet to the clearing; transparent sprites keep their natural proportions. */
#builderStage .builder-animal{object-position:center bottom;left:58%;width:40%;top:48%;height:44%;filter:brightness(.86) saturate(.85) drop-shadow(0 3px 3px #00102277)}
#builderStage .builder-animal[data-animal=fox]{left:65%;width:32%;top:58%;height:34%}
.companion-shadow{left:65%;top:90%;width:28%;height:3%}
#builderMagic .lightning-effects path:last-child{display:none}

/* Prominent companions, grounded at a shared baseline; user-adjustable scale. */
#builderStage .builder-animal,#builderStage .builder-animal[data-animal=fox]{left:var(--animal-left,40%);width:var(--animal-width,58%);top:16%;height:76%;object-position:center bottom}
#builderStage .companion-shadow{left:var(--animal-left,40%);width:var(--animal-width,58%);top:90%;height:3%}
#finalRenderBrief{overflow-wrap:anywhere}

/* Match the original tall frontal wolf: ears at chest height, paws at 92%. */
#builderStage .builder-animal[data-animal=wolf]{height:var(--wolf-height,58%);width:auto;max-width:none;top:auto;bottom:8%;left:80%;transform:translateX(-50%);object-fit:contain;filter:brightness(.94) drop-shadow(0 3px 3px #00102277)}
#builderStage[data-companion=wolf] .companion-shadow{left:65%;width:32%;top:90%}

/* Branching, weapon-anchored electricity: diffuse bloom, colored arc, white core. */
#builderMagic[data-magic=lightning]{filter:none}
#lightningArcs{fill:none;stroke-linejoin:round;stroke-linecap:round}
#lightningArcs .arc-halo{stroke:var(--glow);filter:blur(6px);opacity:.55}
#lightningArcs .arc-color{stroke:var(--glow);filter:drop-shadow(0 0 3px var(--glow));opacity:.95}
#lightningArcs .arc-core{stroke:#f4fcff}
#lightningArcs .arc-sparks{fill:#eaffff;filter:drop-shadow(0 0 3px var(--glow))}
/* Supersede the old rule that hid an obsolete companion-eye bolt. */
#builderMagic .lightning-effects path:last-child{display:initial}

#builderStage .builder-weapon{left:calc(5% + var(--rig-x,0%));top:calc(4% + var(--rig-y,0%))}
#builderStage .builder-weapon[data-weapon=staff]{left:calc(11% + var(--rig-x,0%));top:calc(3% + var(--rig-y,0%))}

/* New upright bodies have higher grips; use shorter tops to keep tips inside the card. */
#builderStage[data-pose=guardian][data-look=neutral] .builder-weapon,#builderStage[data-pose=guardian][data-look=girl] .builder-weapon{left:5.6%;top:2.6%;width:22%;height:15%;transform:rotate(-5deg)}
#builderStage[data-pose=guardian][data-look=girl] .builder-weapon{left:7%;top:3.6%}
#builderStage[data-pose=guardian][data-look=neutral] .builder-weapon[data-weapon=staff],#builderStage[data-pose=guardian][data-look=girl] .builder-weapon[data-weapon=staff]{left:10.5%;top:1%;width:16%;height:16%}
#builderStage[data-pose=guardian][data-look=girl] .builder-weapon[data-weapon=staff]{left:11.9%;top:2%}

/* Device orientation changes the workspace; card orientation is independent. */
.change-photo{display:inline-block;padding:14px;border:1px solid #8da28f;border-radius:8px;color:#234c38}.tabs{overflow-x:auto;flex-shrink:0}.tabs button{min-height:44px;white-space:nowrap}.editor,.panels{min-width:0;min-height:0}.panels{overflow-y:auto;overscroll-behavior:contain}.editor-footer{flex-shrink:0;padding-bottom:max(12px,env(safe-area-inset-bottom))}
@media(max-width:1100px){body{height:100dvh;overflow:hidden}header{height:52px;padding:0 16px}.edition,.intro,.editor-heading{display:none}main{height:calc(100dvh - 52px);min-height:0;width:100%;max-width:none;grid-template-columns:minmax(0,1fr) minmax(300px,1fr)}.preview{padding:8px;min-height:0}.card-wrap{padding:8px;width:100%;min-height:0}.editor{height:100%;display:flex;flex-direction:column;overflow:hidden}.panels{flex:1;padding:16px}.preview-tools{gap:6px;margin:0}.preview-tools button{min-height:36px;padding:6px 10px}.preview-caption{font-size:10px;margin:4px}.finish-caption{display:none}.brand{font-size:17px}.tabs button{font-size:12px;padding:10px 8px}.editor-footer{font-size:11px}.editor-footer button{min-height:44px}}
@media(max-width:1100px) and (orientation:portrait){main{display:grid;grid-template-columns:1fr;grid-template-rows:38% minmax(0,1fr)}.preview{padding:4px}.preview-caption{display:none}.card-wrap{padding:4px}.preview-tools button{min-height:32px;font-size:11px;padding:4px 10px}.editor{border-radius:18px 18px 0 0}.tabs{justify-content:space-around}.panels{padding:12px 18px}.editor-footer{padding-top:8px}.style-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:1100px) and (orientation:landscape){main{grid-template-columns:44% minmax(0,1fr);grid-template-rows:minmax(0,1fr)}.preview-caption{display:none}.panels{padding:12px}.editor-footer{padding:6px 12px}.editor-footer span{display:none}.editor-footer button{width:100%}.tabs button{min-height:40px}.preview-tools button{font-size:11px}.brand{font-size:16px}}
body.expanded .preview{position:fixed;inset:0;z-index:100;background:#101a20;padding:20px}body.expanded .card-wrap{padding:8px}body.expanded .editor,body.expanded header{visibility:hidden}
.outfit-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:16px 0}.outfit-grid button{min-width:0;text-align:left;padding:8px;border:2px solid #d0d9cd;border-radius:12px;background:white;color:#243a30}.outfit-grid button[aria-pressed=true]{border-color:#356246;background:#edf2df}.outfit-grid img{width:100%;height:150px;object-fit:cover;object-position:center 25%;border-radius:7px}.outfit-grid strong,.outfit-grid small{display:block;margin:6px 0}.outfit-grid small{line-height:1.4;font-size:12px;color:#58665c}#showOutfitExample{min-height:48px;width:100%;border:0;border-radius:9px;background:#234b35;color:white;padding:12px}.legacy-composition{margin-top:24px;border-top:1px solid #becdbd;padding-top:16px}.outfit-library input[type=color]{height:44px;width:100%}.outfit-library h3{margin-top:0}
/* First usability pass: quiet workspace, one character configuration. */
.intro,.editor-heading{display:none}.card-wrap{padding-left:8px}.tabs button{flex:1}.character-workspace h3{font-family:'DM Sans',sans-serif;font-size:21px;line-height:1.2}.step-heading .muted{margin-top:6px}.outfit-grid{gap:10px}.outfit-grid img{height:128px}.outfit-grid button{transition:border-color .15s,background .15s}.section-heading{display:flex;justify-content:space-between;gap:12px;align-items:center;margin-top:24px}.section-heading h3{font-size:17px}.text-button{background:none;border:0;color:#2f6149;text-decoration:underline;min-height:44px;font-size:12px;cursor:pointer}.example-note{background:#edf1eb;color:#52635a;border-radius:10px;padding:12px;font-size:12px;line-height:1.5}.example-badge{position:absolute;left:16px;top:10px;z-index:5;background:#14222dde;color:#e0e8df;font-size:9px;letter-spacing:1px;border:1px solid #ffffff30;padding:5px 8px;border-radius:20px}.frame-color-section{margin:22px 0}.frame-color-section>summary{padding:12px 0;font-weight:600}.review-summary{padding:14px;border-radius:10px;background:#e6eddd;line-height:1.5;color:#24412e}#garmentCanvas{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;pointer-events:none}#liveOutfitColors .swatches button{min-width:30px;min-height:30px}#colors>h3,#colors>p:first-of-type{display:none}.preview{padding-top:30px}
@media(max-width:1100px){.preview{padding-top:22px}.example-badge{top:5px;font-size:8px;padding:3px 7px}.preview-caption{display:none}.outfit-grid small{font-size:11px}}
@media(max-height:500px) and (orientation:landscape){.outfit-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.outfit-grid img{height:75px}.outfit-grid small{display:none}.outfit-grid strong{font-size:10px}.step-heading .eyebrow{display:none}.character-workspace h3{font-size:17px}}
.card-text-section{margin:0 0 20px;border-bottom:1px solid #d6dfd0;padding-bottom:14px}.card-text-section>summary,.review-sides button{min-height:44px;padding:12px 0;font-weight:600}.review-sides{display:flex;gap:12px;margin-top:20px}.review-sides button{flex:1;border:1px solid #b9cbb5;border-radius:8px;background:#fff;color:#24412e}

.reference-photo{margin:0 0 16px;padding:10px 12px;border:1px solid #8da28f55;border-radius:10px;font-size:13px}.reference-photo>summary{cursor:pointer;min-height:24px;line-height:24px}.reference-photo #photo{padding-top:12px}.reference-photo #photo>p{font-size:12px}

/* Shared studio chrome. Card art and color swatches retain their own palettes. */
body{background:#101823;color:#edf3f8;font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;isolation:isolate;color-scheme:dark}
body::before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(ellipse at 12% 42%,#267e7760,transparent 58%),radial-gradient(ellipse at 90% 70%,#7553a55c,transparent 55%),#101823}
.ui-help{margin:8px 0;padding:0;border:0;font-size:12px;color:#b9c8d7}.ui-help>summary{min-height:36px;padding:8px 0;font-size:12px;color:#b9c8d7}.ui-help>p{margin:4px 0 12px;line-height:1.6}
header{background:#111d2980;border-color:#eff7ff26}.brand{font-family:inherit;font-size:18px;letter-spacing:2px}.edition,.eyebrow{color:#b6c9cc}.back{color:#c4e6da}
.editor{color:#edf3f8;background:linear-gradient(157deg,#e0f8ff17,transparent 22%,#c3aaff0c),#182333c9;border:1px solid #ecf7ff35;border-top-color:#f0faff80;border-radius:20px;box-shadow:inset 0 1px 0 #ffffff30,0 20px 50px #0003;backdrop-filter:blur(9px);-webkit-backdrop-filter:blur(9px)}
.preview{background:none}.preview-tools button,.review-sides button,.editor details button,.reset-colors{background:linear-gradient(165deg,#ffffff20,#ffffff05 45%,#0d1d2c70 46%);border:1px solid #d6ecff40;color:#e0eee9;border-radius:10px;min-height:44px}
.tabs{margin:12px 12px 0;padding:4px;gap:4px;border:1px solid #d9eaff20;border-radius:12px;background:#0a142b50}.tabs button{border:1px solid transparent;border-radius:9px;min-height:44px;color:#b8c8d6}.tabs button[aria-pressed=true]{background:linear-gradient(165deg,#e2fff336,#92ccb312 48%,#16353070 49%);border-color:#d5ffea65;color:#e8fff1;box-shadow:inset 0 1px 0 #ffffff45}
.editor :is(.muted,.note p,details p,.outfit-grid small,.style-choice small,.finish-note,.finish-option small,.color-row span){color:#b9c7d7}
.editor :is(input:not([type=checkbox]):not([type=range]):not([type=color]),select,textarea){background:#0b172a70;color:#edf3f8;border:1px solid #d1e8ff33;border-radius:10px;min-height:44px}.editor option{background:#1c2b3d;color:#edf3f8}
.editor :is(.outfit-grid button,.style-choice,.finish-option){background:linear-gradient(163deg,#f0ffff16,#ffffff03 40%,#0d192733 41%);color:#e8f1f5;border:1px solid #dceeff30;border-radius:12px;box-shadow:inset 0 1px 0 #ffffff20}.editor :is(.outfit-grid button[aria-pressed=true],.style-choice[aria-pressed=true],.finish-option:has(input:checked)){background:linear-gradient(160deg,#c9ffe629,#66b69d0c);border:1px solid #bde6ce;box-shadow:inset 0 1px 0 #ffffff45,0 0 0 1px #bde6ce25;padding:8px}
.editor :is(.note,.example-note,.review-summary){background:#d0e8ff09;color:#c6d5e2;border:1px solid #c7e7ff20;border-radius:10px}.editor :is(summary,pre,.text-button,.change-photo){color:#c4e7d7}.editor :is(details,.finish-picker,.card-text-section,.reference-photo){border-color:#dcecff28}.editor input[type=range],.editor input[type=checkbox]{accent-color:#bde6ce}
.editor-footer{background:linear-gradient(165deg,#d8edff0c,#152234c9);border-color:#dcecff26;color:#b6c8d7}.editor-footer #next{background:linear-gradient(165deg,#d4f7e8,#a9d8c8 48%,#98cab9 49%);color:#142b29;border:1px solid #e5fff2a0;box-shadow:inset 0 1px 0 #fff8;border-radius:10px;min-height:44px;font-weight:700}.editor h3{letter-spacing:-.5px}.character-workspace .step-heading .eyebrow{display:none}.panels{scrollbar-color:#678b9980 transparent}.editor-footer #status{font-size:11px}.reference-photo{background:#ffffff04}
@media(min-width:1101px){main{padding:16px;gap:16px;min-height:0}.panels{padding:20px}.editor{margin-bottom:0}}
@media(max-width:1100px){.editor{border-radius:18px 18px 0 0}.tabs{margin:8px 8px 0}.panels{padding:14px}.tabs button{font-size:12px}.preview-tools button{min-height:32px}}
.editor .card-text-section{margin:0 0 14px;padding:0 0 8px}.editor .card-text-section>summary{padding:10px 0}.editor .reference-photo{margin-top:0}.editor .ui-help{padding:0;margin:8px 0;border:0}
@media(prefers-reduced-transparency:reduce){.editor{background:#1c2b3c;backdrop-filter:none;-webkit-backdrop-filter:none}}

/* Keep Storybound's web controls in the same left-hand position as Sportbound. */
@media(min-width:1101px){
 body:not(.expanded) main{grid-template-columns:minmax(340px,440px) minmax(0,1fr)}
 body:not(.expanded) main>.editor{grid-column:1;grid-row:1}
 body:not(.expanded) main>.preview{grid-column:2;grid-row:1}
 .card-wrap{padding-left:8px}
}
@media(min-width:641px) and (max-width:1100px) and (orientation:landscape){
 main{grid-template-columns:minmax(300px,44%) minmax(0,1fr)}
 body:not(.expanded) main>.editor{grid-column:1;grid-row:1}
 body:not(.expanded) main>.preview{grid-column:2;grid-row:1}
}

.equipment-picker{margin:18px 0;padding:16px;border:1px solid #dceeff2a;border-radius:12px;background:linear-gradient(160deg,#ffffff0d,#ffffff02)}.equipment-fields{display:grid;grid-template-columns:1fr 1fr;gap:12px}.equipment-fields label{min-width:0}.equipment-picker #powerStudy{display:grid;place-items:center;border-radius:10px;background:radial-gradient(ellipse,#aaccee13,transparent 70%)}.equipment-picker #powerStudyLabel{text-align:center;margin:2px 0 12px}.equipment-picker>p:last-child{font-size:11px;line-height:1.5}

/* Mirror the complete art composition, including layered companions and effects. */
.card[data-mirrored="true"] .art{transform:scaleX(-1)}
.card[data-mirrored="true"] #safeZone{transform:scaleX(-1)}
.preview-tools{flex-wrap:wrap}
#mirrorArt{min-height:44px}
#mirrorArt[aria-pressed="true"]{border-color:#a8e5d5;background:#24433e;color:#ecfff9}

/* Keep badges clear of the held weapon, including mirrored compositions. */
.card[data-live-pirate="true"] .corner-stats{justify-content:flex-end;gap:3%}
.card[data-live-pirate="true"][data-mirrored="true"] .corner-stats{justify-content:flex-start}

.review-photo{margin-top:26px;padding-top:24px;border-top:1px solid #dcecff28}.review-photo img{display:block;max-width:100%;max-height:180px;border-radius:12px}.review-photo button{min-height:44px;border:1px solid #b8d5c5;border-radius:9px;padding:10px 16px;background:#d6ede3;color:#193b30}.review-photo .checkout-preview{width:100%;opacity:.6;cursor:not-allowed}.review-photo input[type=file]{max-width:100%;font-size:13px}.review-photo input::file-selector-button{min-height:44px;border:0;border-radius:5px;margin-right:8px;padding:8px;cursor:pointer}

/* Storybound identity: locally embedded OFL Cormorant Garamond. */
@font-face{font-family:"Storybound Display";src:url(/storybound/assets/storybound-display-d05b0d015b090fb0.woff2) format("woff2");font-weight:300 700;font-style:normal;font-display:swap}
.card{--storybound-display:"Storybound Display",Garamond,Georgia,serif;font-family:var(--storybound-display)}
.card .nameplate h2,.card .card-back h2,.card .back-story h3,.card .ability-heading strong{font-family:var(--storybound-display);font-weight:700;font-style:normal;letter-spacing:-.025em}
.card .nameplate h2{font-size:6.2cqw;line-height:1.05;white-space:normal;overflow-wrap:anywhere;text-transform:none}
.card .nameplate>span{font-family:var(--storybound-display);font-size:3.2cqw;font-weight:600}
.card .card-back h2{font-size:7cqw;margin:5% 0 1.5%;line-height:1.05}
.card .card-back>p{font-size:4cqw;margin-bottom:5%;line-height:1.15}
.card .back-story h3{font-size:5.5cqw;margin:3% 0}
.card .back-story p{font-family:var(--storybound-display);font-size:4cqw;line-height:1.3;font-weight:500}
.card .back-brand{display:flex;flex-direction:column;align-items:center;text-align:center;flex-shrink:0;letter-spacing:normal;gap:1cqw}
.storybound-book-mark{display:block;width:23cqw;height:18.4cqw;flex-shrink:0}
.storybound-wordmark{font-family:var(--storybound-display);font-size:8cqw;line-height:1;font-weight:700;font-variant:small-caps;letter-spacing:-.04em}
.back-collection{font:500 1.7cqw/1.4 'DM Sans',sans-serif;letter-spacing:.18em}
.card .card-back{padding:7% 8%}
.card .back-story{padding-top:4%}
.card .back-edition{margin-top:4%}












.card-back .back-qr{position:absolute;right:6%;bottom:4%;width:24%;aspect-ratio:1;background:#fff;padding:1%;box-sizing:border-box;z-index:1}
.card-back .back-qr img{display:block;width:100%;height:100%;image-rendering:pixelated}
.card-back .back-edition{max-width:70%;padding-right:2%}
.card-back #backStats{padding-right:27%}


/* Custom illustrated wordmark matching selected option 3; keep accessible name in markup. */
.card .storybound-wordmark{display:block;width:68cqw;height:22.67cqw;background:currentColor;font-size:0;line-height:0;flex-shrink:0;-webkit-mask:url("/storybound/assets/storybound-texture-a48ae2c8f8aa96eb.png") center/contain no-repeat;mask:url("/storybound/assets/storybound-texture-a48ae2c8f8aa96eb.png") center/contain no-repeat;margin:-3cqw 0 -2cqw}


/* Compact selected wordmark in the front's existing upper-left brand slot. */
.card .card-top .front-wordmark{width:27cqw;height:9cqw;margin:-3cqw 0;flex-shrink:0;font-size:0;line-height:0;letter-spacing:normal}
.style-planned-price{display:block;margin:8px 2px 3px;font-size:12px;font-weight:700;color:#d8b774}
.storybound-price-summary,.storybound-addons{margin:16px 0;padding:16px;border:1px solid #b8d5c566;border-radius:12px;background:#17354280;color:#e9f4ed}
.storybound-price-glance{display:grid;grid-template-columns:1fr auto;gap:3px 12px;align-items:center;margin:10px 16px 0;padding:10px 14px;border:1px solid #d8bd8480;border-radius:10px;background:#1b3041;color:#f8f2e7;font-size:13px;font-weight:700}
.storybound-price-glance strong{color:#f3dba6;font-size:19px;white-space:nowrap}.storybound-price-glance small{grid-column:1/-1;color:#d4dce0;font-size:11px;font-weight:400}.storybound-price-glance a{color:#f3dba6;text-decoration:underline;text-underline-offset:2px}
.storybound-price-summary h4,.storybound-addons h4{margin:0 0 10px;font-size:1rem;color:#f3dba6}
.storybound-price-line{display:flex;justify-content:space-between;gap:16px;padding:5px 0}
.storybound-price-summary>strong{display:block;margin-top:10px;padding-top:10px;border-top:1px solid #b8d5c566;color:#f3dba6}
.storybound-price-summary p,.storybound-addons p{font-size:12px;line-height:1.5}
.storybound-addons label{display:block;margin:12px 0}
.storybound-addons select,.storybound-addons input[type=number]{display:block;width:100%;margin-top:6px}
.storybound-addons .consent input{display:inline-block;width:auto;margin-right:6px}
.storybound-review-price{font-weight:700;color:#f3dba6;margin:12px 0}
