/* Full-width tier cabinet. Ambient animation is limited to its first screen. */
#subscription-view{width:100%;max-width:none;min-height:calc(100svh - 56px);margin:0;padding:clamp(32px,4vw,72px) clamp(18px,3.2vw,80px) 130px;isolation:isolate;--sub-secondary:var(--mw-light);background:radial-gradient(ellipse 85% 680px at 80% 0,color-mix(in srgb,var(--mw-accent) 12%,transparent),transparent 90%),#0c120f}
#subscription-view[data-tier=lite]{--sub-secondary:#a9bdd1;background:radial-gradient(ellipse 80% 500px at 80% 0,#b6c4d512,transparent 90%),#101314}
#subscription-view[data-tier=standard]{--sub-secondary:#c9f780}
#subscription-view[data-tier=premium]{--sub-secondary:#67dbff}
#subscription-view[data-tier=deluxe]{--sub-secondary:#d49bff}
#subscription-view[data-tier=supreme]{--sub-secondary:#ffcf57}
#subscription-view[data-tier=demigod]{--sub-secondary:#ff6c71}
#subscription-view[data-tier=god]{--sub-secondary:#77ecff}
#subscription-view[data-tier=legend]{--sub-secondary:#ff9d39}
.sub-heading{position:relative;min-height:160px;align-items:center;margin-bottom:30px}
.sub-heading h1{width:fit-content;max-width:100%;font-size:clamp(38px,4.8vw,90px);line-height:1.12;letter-spacing:-.06em;padding-bottom:8px;background:linear-gradient(105deg,var(--mw-light),var(--mw-accent) 23%,var(--sub-secondary) 40%,#fff6e3 50%,var(--mw-accent) 70%,var(--mw-light));background-size:250% 100%;background-clip:text;-webkit-background-clip:text;color:transparent;filter:drop-shadow(0 0 20px color-mix(in srgb,var(--mw-accent) 25%,transparent));animation:sub-title-flow 8s ease-in-out infinite}
.sub-tier-heading{display:block;font-size:11px;letter-spacing:.1em;color:var(--mw-light);margin:3px 0 16px}.sub-heading .eyebrow{color:var(--mw-light);margin-bottom:10px}.sub-heading p:last-child{font-size:14px}
.sub-ambient{position:absolute;z-index:-1;top:0;left:0;right:0;height:760px;overflow:hidden;pointer-events:none;opacity:calc(.16 + var(--sub-energy)*.65)}
.sub-ambient:before{content:'';position:absolute;right:-5%;top:-20%;width:min(700px,75vw);aspect-ratio:1;background:radial-gradient(circle,transparent 25%,color-mix(in srgb,var(--mw-accent) 28%,transparent) 47%,transparent 67%);animation:sub-aura-breathe 11s ease-in-out infinite}
.sub-orbit{position:absolute;right:4%;top:-170px;width:600px;height:600px;border-radius:50%;border:1px solid color-mix(in srgb,var(--mw-accent) 25%,transparent);border-top:2px solid var(--mw-accent);border-bottom-color:var(--sub-secondary);box-shadow:0 0 28px color-mix(in srgb,var(--mw-accent) 8%,transparent);animation:sub-orbit-turn 32s linear infinite;opacity:.65}
.sub-orbit-two{width:510px;height:510px;right:7%;top:-125px;animation-direction:reverse;animation-duration:44s;border-style:dashed;opacity:.35}
.sub-ambient>span{position:absolute;right:18%;top:200px;width:4px;height:4px;border-radius:50%;background:var(--mw-light);box-shadow:0 0 13px var(--mw-accent);animation:sub-spark-rise 8s ease-in-out infinite}
.sub-ambient>span:nth-of-type(2){right:35%;top:270px;animation-delay:-2s}.sub-ambient>span:nth-of-type(3){right:8%;top:370px;animation-delay:-4s}.sub-ambient>span:nth-of-type(4){right:48%;top:150px;animation-delay:-6s}
[data-tier=lite] .sub-orbit,[data-tier=lite] .sub-ambient>span{display:none}[data-tier=lite] .sub-ambient:before{animation-duration:18s}[data-tier=lite] .sub-heading h1{animation-duration:14s}
[data-tier=standard] .sub-orbit{border-radius:15% 85% 22% 78%;opacity:.22}[data-tier=standard] .sub-orbit-two{display:none}
[data-tier=premium] .sub-orbit{border-radius:0;transform:rotate(45deg);opacity:.25;animation-duration:48s}[data-tier=premium] .sub-orbit-two{border-style:solid}
[data-tier=deluxe] .sub-orbit{border-radius:25%;border-style:double;transform:rotate(22deg)}
[data-tier=supreme] .sub-orbit{border-radius:40% 60% 55% 45%;border-style:dotted;animation-duration:22s}[data-tier=supreme] .sub-ambient>span{height:12px;width:2px;animation-duration:5s}
[data-tier=demigod] .sub-ambient:before{background:radial-gradient(circle,#0b070c 0 27%,#ff354f28 29%,#ff354f42 31%,transparent 48%);animation-duration:7s}[data-tier=demigod] .sub-orbit{border-width:2px;animation-duration:21s}
[data-tier=god] .sub-orbit{border-left:2px solid var(--sub-secondary);animation-duration:18s}[data-tier=god] .sub-orbit-two{border-style:solid;animation-duration:24s}
[data-tier=legend] .sub-ambient:before{background:repeating-conic-gradient(from 0deg,transparent 0deg 22deg,#ffc63815 24deg 28deg,transparent 30deg 45deg);border-radius:50%;animation:sub-orbit-turn 60s linear infinite}[data-tier=legend] .sub-orbit{border-style:double;border-width:3px}
@keyframes sub-title-flow{0%,100%{background-position:0% 50%}50%{background-position:100% 50%}}
@keyframes sub-aura-breathe{0%,100%{transform:scale(.95);opacity:.6}50%{transform:scale(1.06);opacity:1}}
@keyframes sub-orbit-turn{to{transform:rotate(360deg)}}
@keyframes sub-spark-rise{0%,100%{transform:translateY(30px);opacity:0}25%{opacity:.8}80%{transform:translateY(-100px);opacity:0}}
.sub-ambient.is-asleep *,.sub-ambient.is-asleep:before{animation-play-state:paused!important}
.sub-overview{grid-template-columns:minmax(0,1fr) minmax(0,1.2fr)}.sub-membership{min-height:285px}.sub-membership h2{font-size:clamp(28px,3vw,52px);overflow-wrap:anywhere}.sub-balance strong{color:var(--mw-light)}
.sub-tools{margin:36px 0 40px;scroll-margin-top:25px}.sub-tools .sub-section-heading h2{font-size:clamp(26px,2.3vw,38px)}.sub-tools h2>span{font-size:13px;vertical-align:middle;padding:5px 9px;border:1px solid color-mix(in srgb,var(--mw-accent) 35%,transparent);border-radius:20px;color:var(--mw-light)}
.sub-tool-controls{display:flex;gap:20px;justify-content:space-between;align-items:end;margin-bottom:12px}.sub-tool-filters{display:flex;flex-wrap:wrap;gap:7px}.sub-tool-filters button{border:1px solid #b9c6b126;background:#101813;color:#afc0ac;padding:9px 13px;border-radius:6px;font-size:12px}.sub-tool-filters button[aria-pressed=true]{border-color:var(--mw-accent);color:var(--mw-light);background:color-mix(in srgb,var(--mw-accent) 12%,#101713)}
.sub-tool-search{width:260px;flex:none;font-size:10px;color:#adbcaa}.sub-tool-search>span{display:block;margin-bottom:5px}.sub-tool-count,.sub-tools-note,.sub-tool-empty{font-size:11px;color:#a9b7a3;line-height:1.7;margin:12px 0}
.sub-tool-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.sub-tool{display:flex;flex-direction:column;min-width:0;border:1px solid color-mix(in srgb,var(--mw-accent) 24%,transparent);border-radius:3px 12px 3px 12px;background:linear-gradient(120deg,color-mix(in srgb,var(--mw-accent) 5%,#141c16),#0b140fd9);padding:18px;position:relative;transition:border-color .25s,transform .25s,box-shadow .25s}.sub-tool.is-own{border-top-color:color-mix(in srgb,var(--mw-accent) 65%,transparent);background:linear-gradient(120deg,color-mix(in srgb,var(--mw-accent) 10%,#141c16),#0b140fd9)}
.sub-tool-label{display:flex;align-items:center;gap:8px;color:var(--mw-light);font-size:10px}.sub-tool-label svg{width:22px;height:22px;flex:none;color:var(--mw-accent)}.sub-tool h3{font-size:15px;line-height:1.4;letter-spacing:-.025em;font-weight:550;margin:13px 0 7px;color:#e5ecdf}.sub-tool>p{font-size:12px;color:#aebda7;line-height:1.6;margin-bottom:18px}.sub-tool>button{margin-top:auto;display:flex;justify-content:space-between;gap:8px;text-align:left;border:1px solid color-mix(in srgb,var(--mw-accent) 27%,transparent);border-radius:5px;background:#09120e77;color:var(--mw-light);padding:10px;font-size:11px}.sub-tool>button:disabled{opacity:.45;cursor:default}
@media(hover:hover){.sub-tool:hover{transform:translateY(-3px);border-color:color-mix(in srgb,var(--mw-accent) 60%,transparent);box-shadow:0 8px 20px #0003}.sub-tool>button:not(:disabled):hover{background:color-mix(in srgb,var(--mw-accent) 16%,#101813)}}
.sub-action-dialog{width:min(650px,calc(100% - 28px));max-height:calc(100svh - 48px);padding:26px;color:#e8ecdf;border:1px solid var(--mw-accent);border-radius:6px 20px;background:radial-gradient(ellipse at 100% 0,color-mix(in srgb,var(--mw-accent) 14%,transparent),transparent 65%),#101811;box-shadow:0 30px 100px #0009;overflow:auto;overscroll-behavior:contain}.sub-action-dialog::backdrop{background:#020805d9}.sub-action-dialog[open]{opacity:0;transform:translateY(12px) scale(.985);transition:opacity .18s ease,transform .18s ease}.sub-action-dialog[open].is-visible{opacity:1;transform:none}.sub-action-head{display:flex;justify-content:space-between;gap:15px;align-items:center}.sub-action-head .eyebrow{margin:0;color:var(--mw-light)}.sub-action-head button{width:36px;height:36px;flex:none;border:1px solid #ffffff25;border-radius:6px;background:#ffffff05;font-size:24px}.sub-action-dialog h2{margin:16px 0;font-size:28px}.sub-action-description,.sub-action-conditions{font-size:13px;line-height:1.8;color:#bcc9b4}.sub-action-tags{display:flex;gap:7px;flex-wrap:wrap;margin:15px 0}.sub-action-tags span{font-size:11px;color:var(--mw-light);border:1px solid color-mix(in srgb,var(--mw-accent) 35%,transparent);padding:5px 8px;border-radius:5px}.sub-action-conditions{font-size:11px;border-left:2px solid var(--mw-accent);padding-left:10px;margin:12px 0 20px}
.sub-action-dialog form{display:grid;gap:16px}.sub-action-dialog label{display:grid;gap:7px;font-size:12px;color:#c5d1bf}.sub-action-dialog input,.sub-action-dialog select{width:100%;min-width:0;max-width:100%;font-size:13px;padding:10px;background:#0c140e;border:1px solid #ccd8bd35;color:#edf1e5;border-radius:5px}.sub-form-help,.sub-unavailable{font-size:11px;color:#a6b49c;line-height:1.8}.sub-unavailable{padding:16px;background:#ffffff04;border:1px dashed #ccd8bd35;border-radius:6px}.sub-form-submit{padding:13px;background:linear-gradient(110deg,var(--mw-accent),var(--mw-light));color:#101710;font-weight:550;border:0;border-radius:6px}.sub-action-result{font-size:12px;line-height:1.8;overflow-wrap:anywhere;color:var(--mw-light)}.sub-action-result:empty{display:none}
.sub-palette{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;border:1px solid #ccd8bd22;border-radius:6px;padding:14px}.sub-palette legend{font-size:11px;color:#acbca1}.sub-palette input[type=color]{height:45px;padding:4px}.sub-palette-preview{grid-column:1/-1;height:90px;border-radius:4px 18px;border:1px solid #ffffff30}.sub-profile-example{display:flex;align-items:center;gap:15px;padding:16px;background:#ffffff04;border:1px solid #ffffff15;border-radius:8px}.sub-profile-example img{width:55px;height:65px;object-fit:contain}.sub-profile-example b{font-size:19px}.sub-profile-example small{display:block;font-size:11px;color:#b7c6ac}
.sub-storage-slots{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:7px}.sub-storage-slots button{display:grid;justify-items:center;gap:8px;border:1px solid #ffffff25;background:#ffffff04;padding:10px 3px;border-radius:5px;font-size:10px}.sub-storage-slots svg{width:22px;height:22px;color:var(--mw-light)}.sub-storage-slots button[aria-pressed=true]{border-color:var(--mw-accent);background:color-mix(in srgb,var(--mw-accent) 15%,transparent)}
@keyframes sub-dialog-enter{from{transform:translateY(12px) scale(.985);opacity:0}to{transform:none;opacity:1}}
@media(min-width:2100px){.sub-tool-grid{grid-template-columns:repeat(5,minmax(0,1fr))}}
@media(max-width:1200px){.sub-tool-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.sub-tool-controls{align-items:stretch;flex-direction:column}.sub-tool-search{width:100%;max-width:420px}}
@media(max-width:850px){.sub-overview{grid-template-columns:1fr}.sub-tool-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.sub-heading{min-height:0}.sub-ambient{height:620px;opacity:.3}.sub-heading h1{font-size:clamp(38px,7vw,62px)}}
@media(max-width:520px){.sub-tool-grid{grid-template-columns:1fr}.sub-tool{padding:15px}.sub-tool-controls{gap:12px}.sub-tool-filters button{font-size:11px;padding:8px 10px}.sub-action-dialog{padding:18px}.sub-action-dialog h2{font-size:24px}.sub-storage-slots{grid-template-columns:repeat(3,minmax(0,1fr))}.sub-heading h1{font-size:clamp(34px,9.5vw,46px)}.sub-tier-heading{font-size:10px}.sub-heading p:last-child{font-size:12px}}
@media(prefers-reduced-motion:reduce){.sub-heading h1,.sub-ambient *,.sub-ambient:before{animation:none!important}.sub-action-dialog[open]{animation:none}}

.sub-heading.is-asleep h1{animation-play-state:paused!important}
@media(max-width:520px){.sub-heading{align-items:flex-start}}
@media(prefers-reduced-motion:reduce){.sub-action-dialog[open]{transition:none}}