/* Creator and Supply controls share the game's inked steel, red and aged-brass vocabulary. */
.creator-setup .creator-fields{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.creator-field{min-width:0}.creator-field>span{display:flex;align-items:center;gap:6px}.creator-field>span>svg{width:18px;height:18px}
.creator-field select,.creator-field input[type=number]{min-width:0;max-width:100%;box-sizing:border-box;min-height:44px;border:1px solid #796444;border-radius:3px;background-color:#171c15;color:#f0e5cb;font:inherit;padding:10px}
.visual-select:not(.enhanced) .creator-select-trigger,.visual-select:not(.enhanced) .creator-select-options{display:none}
.visual-select.enhanced>select{display:none}.visual-select .creator-select-trigger{display:flex;align-items:center;gap:10px;width:100%;padding:7px 10px 7px 7px;min-height:60px;border:1px solid #826941;border-bottom-width:3px;border-radius:3px;background:linear-gradient(130deg,#2c3023,#131913);color:#f2e6ca;text-align:left;box-sizing:border-box}
.creator-select-trigger>b{flex:1;min-width:0;font:400 18px/1.05 var(--display);overflow-wrap:anywhere}.creator-chevron{width:20px;height:20px;flex:none;color:#d3b26b}.creator-chevron svg{width:100%;height:100%}.expanded .creator-chevron{transform:rotate(180deg)}
.creator-option-image{display:flex;align-items:center;justify-content:center;aspect-ratio:16/9;overflow:hidden;flex:none;background:#161e18;border:1px solid #6c5c3d;box-sizing:border-box;isolation:isolate}
.creator-select-trigger .creator-option-image{width:76px}.creator-option-image img{display:block;width:100%;height:100%;object-fit:contain;image-rendering:pixelated}.creator-mode-art{display:block;width:100%;height:100%;color:#d8bc78}.creator-mode-art>svg{display:block;width:100%;height:100%}
.creator-mode-art .ink{stroke:#d2bc80;stroke-width:1.6;fill:#20291e}.creator-mode-art .globe{fill:#53634b}.creator-mode-art .globe-l,.creator-mode-art .contour{fill:none;stroke:#b09a68}.creator-mode-art .contour{opacity:.3}
.creator-select-options{margin-top:6px;padding:8px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;border:1px solid #8d744a;background:#0e140f;box-shadow:inset 0 0 16px #0008}
.creator-select-options[hidden]{display:none}.creator-select-options>button{display:grid;min-width:0;gap:6px;padding:6px;border:1px solid #4d573e;background:#252c20;color:#e9dfc4;text-align:center;font:400 16px/1.1 var(--display)}
.creator-select-options>button .creator-option-image{width:100%}.creator-select-options>button[aria-selected=true]{border:2px solid #d14842;padding:5px;background:#422822}.creator-select-options>button:focus-visible,.creator-select-trigger:focus-visible{outline:3px solid #e3bc62;outline-offset:2px}
.creator-skill{display:flex;align-items:flex-end;gap:3px;height:26px;padding:6px}.creator-skill i{width:9px;height:calc(7px + var(--bar,1)*3px);background:#383e30;border:1px solid #5e654d;transform:skewY(-10deg)}.creator-skill i:nth-child(2){--bar:2}.creator-skill i:nth-child(3){--bar:3}.creator-skill i:nth-child(4){--bar:4}.creator-skill i:nth-child(5){--bar:5}.creator-skill .filled{background:#d8b96a;border-color:#f0d18c}.creator-skill.brutal .filled{background:#ba3b36;border-color:#df6557}.creator-skill.mixed .filled{background:repeating-linear-gradient(45deg,#ccad60 0 3px,#635c3a 3px 5px)}
.creator-size-art{position:relative;display:flex;justify-content:center;align-items:center;width:100%;height:100%;color:#cdbb83}.creator-size-art>svg{width:50%;height:64%;z-index:1}.creator-size-art:before,.creator-size-art:after{content:'';position:absolute;border:1px solid #8e9b6b;inset:16% 22%;transform:translate(3px,3px)}.creator-size-art:after{transform:translate(6px,6px);opacity:.5}.size-small{transform:scale(.68)}.size-medium{transform:scale(.82)}.size-huge{transform:scale(1.12)}
.creator-override .override-rules{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.override-rules>article{padding:12px;border:1px solid #655839;background:#1c2318;min-width:0}.override-toggle{display:flex;align-items:center;flex-wrap:wrap;gap:6px;font-size:12px}.override-toggle>svg{width:18px;height:18px;flex:none}.override-toggle>b{flex:1;min-width:90px}.override-toggle input{width:20px;height:20px;accent-color:#bb3938}.override-value{display:flex;align-items:center;gap:8px;margin-top:10px}.override-value input{width:60%;min-width:0;min-height:44px;background:#11170f;color:#f0dfb7;border:1px solid #72613d;padding:8px;box-sizing:border-box}.override-value input:disabled{opacity:.45}.override-value output{font:400 19px var(--display);color:#d4ba77}
.supply-currency{display:grid;grid-template-columns:1fr 1fr;gap:10px}.supply-currency>.btn{display:flex;align-items:center;justify-content:center;gap:10px;min-height:62px}.supply-currency .art{width:40px;height:40px}
.price .art,.btn .price .art,.currency-tabs .art,.currency-sheet .setup-head p .art,.service-bonuses .art{display:inline-block;width:22px;height:22px;vertical-align:middle;flex:none}.price .art img,.currency-tabs .art img{width:100%;height:100%;object-fit:contain}.currency-pack>.art{width:54px;height:54px;flex:none}.currency-pack .btn>.art{width:20px;height:20px}.currency-sheet .setup-head p{display:flex;align-items:center;gap:6px}
.supply-crate-store{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;text-align:center}.supply-crate-store>.line-item{display:flex;flex-direction:column;justify-content:space-between;gap:8px;min-width:0;border:0;background:linear-gradient(#242b22,#141b14);padding:10px 4px}.supply-crate-store>.line-item>.art{width:100%;height:104px;max-width:130px}.supply-crate-store>.line-item>span{font:400 19px/1.1 var(--display)}.supply-crate-store .btn{max-width:100%;padding:8px}.supply-sheet .crates{grid-template-columns:repeat(2,minmax(0,1fr));justify-content:center;align-items:start;text-align:center;margin:14px auto;width:100%;max-width:320px}.supply-sheet .crate{min-width:0}
.spin-supplies{padding:14px 0}.supply-section-head{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap;margin-bottom:8px}.supply-section-head h3{margin:0}.spin-supply-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.spin-supply{display:grid;grid-template-columns:1fr;justify-items:center;gap:2px;position:relative;min-width:0;padding:7px 8px 12px;text-align:center;border:1px solid #786640;border-bottom-width:3px;border-radius:3px;background:radial-gradient(ellipse at 50% 40%,#54422b55,transparent 70%),#171e15;color:#f0dfb7;overflow:hidden}
.spin-supply.super{border-color:#bd963e;background:radial-gradient(ellipse at 50% 40%,#b47b2944,transparent 70%),#1b2015}.spin-supply>canvas{display:block;width:100%;height:152px;max-width:240px}.spin-supply>b{font:400 24px/1 var(--display)}.spin-supply>small{color:#b7b59c;font-size:12px}.spin-supply>strong{position:absolute;top:8px;right:8px;min-width:26px;padding:3px;background:#902c2a;border:1px solid #d2a95f;color:#fff1c9;font:400 22px var(--display)}
.spin-help{margin:12px 0;color:#b6b6a1;font-size:12px}.spin-help summary{font:400 15px var(--display);color:#d8c48e}.spin-help p{line-height:1.5}.spin-supplies>#supreme-spins{margin-top:10px;max-width:100%}
.spin-wheel-grid{display:grid;grid-template-columns:minmax(0,280px);justify-content:center;gap:12px}.spin-batch .spin-wheel-grid{grid-template-columns:repeat(auto-fit,minmax(120px,1fr))}.spin-wheel-card{display:grid;align-content:start;justify-items:center;min-width:0;border:1px solid #6e6243;border-bottom-width:3px;background:radial-gradient(ellipse,#5a472a33,transparent 75%),#171e16;padding:8px;text-align:center;overflow:hidden;box-sizing:border-box}.spin-wheel-card>small{font:400 17px var(--display);color:#c8b67f}.spin-wheel-card>canvas{width:100%;height:220px;display:block}.spin-batch .spin-wheel-card>canvas{height:146px}.spin-wheel-card [hidden]{display:none!important}.spin-wheel-card.landed{border-color:var(--spin-color);box-shadow:inset 0 0 24px color-mix(in srgb,var(--spin-color) 12%,transparent)}
.spin-landed{display:grid;justify-items:center;align-content:center;gap:4px;min-height:220px;width:100%}.spin-batch .spin-landed{min-height:146px}.spin-landed>img,.spin-landed>.art{width:100%;height:132px;object-fit:contain;max-width:180px}.spin-batch .spin-landed>img,.spin-batch .spin-landed>.art{height:88px}.spin-landed>.art img{width:100%;height:100%;object-fit:contain}.spin-landed>small{font-size:11px;color:var(--spin-color)}.spin-landed>b{font:400 20px/1.05 var(--display);overflow-wrap:anywhere}.spin-batch .spin-landed>b{font-size:18px}.spin-preparing-art{max-width:220px;margin:auto}.spin-preparing-art canvas{width:100%;height:170px}.spin-preparing progress{width:100%;accent-color:#bf993f}.spin-preparing [role=status]{text-align:center}
.war-service-card{padding:12px;background:#1b2118;border:1px solid #6b6042}.war-service-card>header{display:flex;gap:8px;align-items:center;font:400 24px var(--display)}.war-service-card svg{width:22px;height:22px;flex:none}.service-pips{display:flex;gap:3px;margin-left:auto}.service-pips i{height:16px;width:11px;transform:skew(-12deg);background:#31372b;border:1px solid #6a6e50}.service-pips i.on{background:#d5b363;border-color:#e6c782}.service-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin:12px 0;gap:6px}.service-stats>span{display:grid;justify-items:center;gap:4px;padding:8px 2px;background:#11180f}.service-stats b{font:400 26px var(--display)}.service-stats small{font-size:11px;color:#b6b59b}.service-bonuses{display:flex;gap:12px;flex-wrap:wrap;font-size:12px;color:#c4bf9e}.service-bonuses>span{display:flex;align-items:center;gap:4px}.service-last,.service-record-row{display:flex;align-items:center;gap:8px;font-size:12px;padding:8px 0}.service-last b,.service-record-row b{text-transform:capitalize}.service-last span,.service-record-row span{margin-left:auto;color:#bdb79c}
.wc-support{display:flex;align-items:center;justify-content:center;gap:6px;margin:8px 0;flex-wrap:wrap;white-space:normal}.wc-support>svg{width:23px;height:23px}.wc-support small{font-size:11px;flex-basis:100%}.support-preview .setup-body{text-align:center}.support-banner{display:flex;align-items:center;justify-content:center;gap:12px;padding:20px 0}.support-banner strong{font:400 38px var(--display)}.support-banner strong span{color:#c9aa60}.support-meter{position:relative;height:22px;background:#402722;border:2px solid #938052;overflow:hidden}.support-meter i,.support-meter b{display:block;position:absolute;left:0;top:0;bottom:0}.support-meter i{background:repeating-linear-gradient(45deg,#c5ae5c 0 6px,#8b8347 6px 12px)}.support-meter b{background:#769752}.support-effect{font:400 22px var(--display)}
@media(max-width:480px){.creator-setup .creator-fields,.creator-override .override-rules{grid-template-columns:minmax(0,1fr)}.spin-supply>canvas{height:124px}.spin-supply>b{font-size:21px}.supply-crate-store>.line-item>.art{height:82px}.supply-crate-store>.line-item>span{font-size:17px}.spin-batch .spin-wheel-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.spin-machine .setup-footer .btn{min-width:0;white-space:normal}.creator-override-select{display:flex;flex-wrap:wrap}.creator-override-select>.creator-field{flex:1 1 160px}}
@media(prefers-reduced-motion:reduce){.creator-mode-art *{animation:none!important}.spin-wheel-card{transition:none}}
.spin-wheel-card.wheel-super{grid-column:1/-1;background:radial-gradient(ellipse at 50% 30%,#62522c55,transparent 74%),#151e17;border-color:#ae8b41}
.spin-wheel-card.wheel-super>canvas{height:240px;max-width:520px}.spin-batch .wheel-super>canvas{height:210px}.wheel-super.landed>canvas{height:140px}
.spin-landed .spin-prize{display:grid;align-content:center;justify-items:center;gap:4px;visibility:hidden;min-width:0;padding:6px;box-sizing:border-box}.spin-landed .spin-prize.revealed{visibility:visible;animation:spin-prize-pop .45s ease both}
.spin-prize>img,.spin-prize>.art{display:block;width:100%;height:146px;max-width:210px;object-fit:contain;filter:drop-shadow(0 0 8px color-mix(in srgb,var(--spin-color) 36%,transparent))}.spin-prize>.art img{width:100%;height:100%;object-fit:contain}.spin-prize>small{font-size:11px;color:var(--spin-color)}.spin-prize>b{font:400 22px/1.05 var(--display);overflow-wrap:anywhere}
.super-prizes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;min-height:130px;width:100%}.super-prizes .spin-prize{border:1px solid color-mix(in srgb,var(--spin-color) 55%,#293422);background:#111a13;min-height:130px}.super-prizes .spin-prize>img,.super-prizes .spin-prize>.art{height:80px}.super-prizes .spin-prize>b{font-size:17px}.spin-batch .spin-prize>img,.spin-batch .spin-prize>.art{height:96px}.spin-batch .super-prizes .spin-prize>img,.spin-batch .super-prizes .spin-prize>.art{height:74px}
@keyframes spin-prize-pop{0%{opacity:.2;transform:translateY(10px) scale(.91)}65%{opacity:1;transform:translateY(-2px) scale(1.025)}100%{transform:none}}
@media(max-width:360px){.wheel-super>canvas{height:190px}.spin-batch .wheel-super>canvas{height:180px}.super-prizes{gap:4px}.super-prizes .spin-prize{padding:4px}.super-prizes .spin-prize>b{font-size:15px}}
@media(prefers-reduced-motion:reduce){.spin-landed .spin-prize.revealed{animation:none}}

@media(max-width:480px){.spin-supply-grid{grid-template-columns:minmax(0,1fr);justify-items:center}.spin-supply{width:100%;box-sizing:border-box}.spin-supply>canvas{height:174px;max-width:260px}.spin-supply.super>canvas{height:220px;max-width:380px}.spin-supply>b{font-size:26px}}

.spin-machine:not(.spin-batch) .spin-wheel-grid{grid-template-columns:minmax(0,560px)}.spin-machine:not(.spin-batch) .wheel-super>canvas{height:310px;max-width:580px}.spin-machine:not(.spin-batch) .wheel-super.landed>canvas{height:170px}.spin-machine:not(.spin-batch) .spin-wheel-card:not(.wheel-super){width:100%;max-width:320px;justify-self:center}