/* F8.4a — the production 2D menu, creator and character sheet in the 3D client. */
.f8-canonical-shell{position:fixed!important;inset:0!important;z-index:2000!important;display:block!important;width:100vw!important;height:100vh!important;padding:0!important;background:#03040a!important;overflow:hidden!important}
.f8-canonical-shell.hidden,.f8-character-creator.hidden,.cc-main-menu.hidden,.f8-sheet-content.hidden,#f8-character-view.hidden{display:none!important}
body.f8-shell-active .hud,body.f8-shell-active #f8-global-skillbar,body.f8-shell-active #f8-dialogue{visibility:hidden!important;pointer-events:none!important}
.f8-canonical-shell .cc-main-menu{position:absolute;inset:0;z-index:1}
.f8-canonical-shell .cc-menu-bg{background-image:url('../../assets/ui/chronocairn-main-menu.webp')!important;background-size:cover!important;background-position:center!important}
.f8-canonical-shell .cc-menu-button{font-family:var(--chronocairn-font,"Morris Roman Black",Georgia,serif)!important}

/* V12 gender → class creator, preserving the current 2D proportions and copy. */
.f8-character-creator{position:absolute;inset:0;z-index:5;display:grid;place-items:center;padding:18px;background:radial-gradient(circle at 50% 42%,#1c102b,#05060cf2 70%)}
.f8-creator-card{width:min(1540px,97vw);height:min(870px,95vh);display:grid;grid-template-rows:64px minmax(0,1fr);overflow:hidden;border:2px solid #6f3f8f;background:#070812;box-shadow:0 0 0 4px #151323,0 30px 100px #000e,0 0 50px #8f45c834}
.v12-creator-topbar{display:flex;align-items:center;justify-content:space-between;padding:0 24px;border-bottom:1px solid #422957;background:linear-gradient(90deg,#171020,#0a0b13 55%,#161020)}
.v12-creator-steps{display:flex;align-items:center;gap:16px;color:#675c71;font:900 11px ui-monospace,monospace;letter-spacing:.13em}.v12-creator-steps i{width:74px;height:1px;background:#45344f}.v12-creator-steps span.active{color:#d5a0f0;text-shadow:0 0 12px #b74fff88}.v12-creator-topbar>button{padding:10px 16px;border:1px solid #604078;background:#100d18;color:#bfa9c9;font:900 10px ui-monospace,monospace;letter-spacing:.12em}
#f8-character-picker{min-height:0;overflow:hidden}.v12-gender-screen{height:100%;display:grid;place-items:center;background:radial-gradient(circle at center,#171021,#080912 65%)}.v12-gender-wrap{text-align:center}.v12-kicker{color:#a275ba;font:900 11px ui-monospace,monospace;letter-spacing:.23em;text-transform:uppercase}.v12-gender-wrap h2{margin:9px 0 24px;color:#eee7f2;font-size:34px;letter-spacing:.07em}.v12-gender-grid{display:grid;grid-template-columns:repeat(2,430px);gap:22px}.v12-gender-card{position:relative;display:grid;place-items:center;height:500px;margin:0;padding:18px;border:2px solid #3d3048;background:radial-gradient(circle at 50% 42%,#24152f,#0a0b12 67%);color:#ccc;overflow:hidden}.v12-gender-card:hover,.v12-gender-card.selected{border-color:#af5ce0;box-shadow:inset 0 0 36px #8d42b62b,0 0 24px #a64ddb32}.v12-gender-card img{width:260px;height:330px;object-fit:contain;image-rendering:pixelated;filter:drop-shadow(0 14px 12px #000d)}.v12-gender-label{font-size:22px;letter-spacing:.15em}.v12-gender-mark{position:absolute;right:17px;top:15px;display:none;width:27px;height:27px;border:1px solid #be76df;border-radius:50%;color:#e6b9ff}.v12-gender-card.selected .v12-gender-mark{display:grid;place-items:center}.v12-gender-actions{margin-top:22px}.v12-primary{min-width:180px;padding:13px 22px;border:1px solid #b66ce2;background:linear-gradient(180deg,#5b2879,#351547);color:#f4e8f8;font:900 12px var(--chronocairn-font,Georgia,serif);letter-spacing:.09em;box-shadow:0 0 18px #a14aca35}
.v12-class-screen{height:100%;display:grid;grid-template-rows:minmax(0,1fr) 124px;background:linear-gradient(145deg,#0c0d17,#070811 62%,#16101d)}.v12-class-main{display:grid;grid-template-columns:310px minmax(360px,1fr) 350px;min-height:0}.v12-class-left,.v12-playstyle{padding:42px 30px;background:#080a12cc}.v12-class-left{border-right:1px solid #382943}.v12-class-emblem{display:grid;place-items:center;width:78px;height:78px;border:2px solid var(--class-accent);border-radius:50%;color:var(--class-accent);font-size:40px;box-shadow:0 0 28px color-mix(in srgb,var(--class-accent) 38%,transparent)}.v12-class-left h2{margin:24px 0 5px;color:#f0e9f3;font-size:33px}.v12-class-role{color:var(--class-accent);font:900 10px ui-monospace,monospace;letter-spacing:.13em}.v12-class-summary{margin-top:25px;color:#aaa0ad;font:16px/1.55 Georgia,serif}.v12-avatar-stage{position:relative;display:grid;place-items:center;overflow:hidden;background:radial-gradient(circle at 50% 43%,color-mix(in srgb,var(--class-accent) 18%,#191020),#090a11 64%)}.v12-avatar-stage>img{width:min(480px,88%);height:calc(100% - 105px);object-fit:contain;image-rendering:pixelated;filter:drop-shadow(0 22px 18px #000e)}.v12-name-field{position:absolute;left:50%;bottom:25px;width:min(340px,76%);transform:translateX(-50%);color:#9f91a7;font:900 9px ui-monospace,monospace;letter-spacing:.13em;text-align:center}.v12-name-field input{display:block;width:100%;margin-top:7px;padding:10px 12px;border:1px solid #5b416e;background:#080910e8;color:#f1eaf5;font:20px var(--chronocairn-font,Georgia,serif);text-align:center;outline:0}.v12-name-field input:focus{border-color:var(--class-accent);box-shadow:0 0 16px color-mix(in srgb,var(--class-accent) 34%,transparent)}.v12-playstyle{border-left:1px solid #382943}.v12-playstyle h3{margin:0 0 27px;color:#d6c7dc;font:900 11px ui-monospace,monospace;letter-spacing:.16em}.v12-perk{display:grid;grid-template-columns:51px 1fr;gap:13px;margin:0 0 21px;padding-bottom:20px;border-bottom:1px solid #292331}.v12-perk-icon{display:grid;place-items:center;width:49px;height:49px;border:1px solid var(--class-accent);color:var(--class-accent);font-size:24px;background:#0d0e17}.v12-perk b{display:block;color:#e4dce8;font-size:15px}.v12-perk span{display:block;margin-top:5px;color:#948a9b;font:12px/1.4 Georgia,serif}.v12-class-footer{display:grid;grid-template-columns:150px minmax(0,1fr) 190px;gap:14px;align-items:center;padding:15px 20px;border-top:1px solid #452f52;background:#090a12}.v12-back{height:49px;border:1px solid #4b3b58;background:#0d0e16;color:#9c91a5;font-weight:900}.v12-class-strip{display:grid;grid-template-columns:repeat(6,1fr);gap:7px}.v12-class-choice{height:78px;margin:0;padding:7px;border:1px solid #36303e;background:#0c0d15;color:#8f8596}.v12-class-choice:hover,.v12-class-choice.selected{border-color:var(--class-accent);color:#eee4f1;box-shadow:inset 0 -3px var(--class-accent),0 0 13px color-mix(in srgb,var(--class-accent) 27%,transparent)}.v12-icon{display:block;color:var(--class-accent);font-size:25px}.v12-label{display:block;margin-top:4px;font-size:10px}.v12-start{min-width:0;height:49px;padding:8px}

/* Current production CHARACTER & INVENTORY topology. */
#inventory{display:grid!important;place-items:center!important;padding:12px!important;background:#02030ad9!important}#inventory.hidden{display:none!important}.f8-inventory-card{width:min(1500px,97vw);height:min(920px,97vh);display:grid;grid-template-rows:46px 43px minmax(0,1fr) 184px;overflow:hidden;border:2px solid #6c4387;background:linear-gradient(145deg,#10111c,#080910 58%,#15101c);box-shadow:0 0 0 4px #141322,0 28px 100px #000e}.f8-inventory-card>h2{margin:0;padding:11px 20px;border-bottom:1px solid #382a45;color:#d69cf1;font-size:22px;letter-spacing:.06em}.f8-sheet-tabs{display:flex;gap:5px;padding:6px 18px;border-bottom:1px solid #35283f;background:#080910}.f8-sheet-tabs button{min-width:120px;margin:0;padding:7px 16px;border:1px solid #40324c;background:#0d0f18;color:#8f8598;font:900 9px ui-monospace,monospace;letter-spacing:.1em}.f8-sheet-tabs button.selected{border-color:#9e58c4;background:#22132e;color:#edd8f7;box-shadow:inset 0 -2px #b664df}.f8-sheet-tabs button:last-child{margin-right:auto}
.f8-inventory-card .v5-char-menu{display:grid;grid-template-columns:minmax(540px,.9fr) minmax(650px,1.1fr);gap:14px;min-height:0;padding:12px 16px}.f8-inventory-card .v5-character-side,.f8-inventory-card .v5-bag-side{min-height:0;border:1px solid #382a45;background:#070912;overflow:hidden}.f8-inventory-card .v5-character-side{display:grid;grid-template-rows:56px 414px minmax(0,1fr);padding:0 13px 10px}.f8-inventory-card .v5-character-head{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #30263a}.f8-inventory-card .v5-character-name{color:#f0e9f4;font-size:23px}.f8-inventory-card .v5-character-level{color:#ad73c8;font:900 9px ui-monospace,monospace;letter-spacing:.07em}.f8-inventory-card .v5-character-head button{width:38px;height:38px;margin:0;border:1px solid #65417b;background:#100d18;color:#e0c4ed;font-size:25px}
.f8-inventory-card .v5-paperdoll{position:relative;width:100%;height:414px;margin:0;background:radial-gradient(circle at 50% 43%,#281735,#090a11 62%);overflow:hidden}.f8-inventory-card .v5-avatar{position:absolute;left:118px;right:118px;top:0;bottom:98px;display:grid;place-items:center}.f8-inventory-card .v5-avatar img{width:94%;height:94%;object-fit:contain;image-rendering:pixelated;filter:drop-shadow(0 12px 10px #000d)}.f8-inventory-card .equipment{position:absolute;inset:0;z-index:3}.f8-inventory-card .equip-slot{position:absolute;width:112px;height:94px;box-sizing:border-box;border:1px solid #4b3a59;background:#0b0c14}.f8-inventory-card .equip-slot>.f8-item-slot{width:100%;height:100%;aspect-ratio:auto;padding:4px 4px 18px;border:0}.f8-inventory-card .equip-slot>.label{position:absolute;z-index:8;left:4px;right:4px;bottom:4px;color:#a79daf;font:8px ui-monospace,monospace;text-align:center;pointer-events:none}.f8-inventory-card .equip-head{left:0;top:0}.f8-inventory-card .equip-trinket{right:0;top:0}.f8-inventory-card .equip-torso{left:0;top:104px}.f8-inventory-card .equip-pants{right:0;top:104px}.f8-inventory-card .equip-boots{right:0;top:208px}.f8-inventory-card .equip-pet{left:0;top:208px}.f8-inventory-card .equip-bag,.f8-inventory-card .equip-ring1,.f8-inventory-card .equip-necklace,.f8-inventory-card .equip-ring2{bottom:0;width:23.5%}.f8-inventory-card .equip-bag{left:0}.f8-inventory-card .equip-ring1{left:25.5%}.f8-inventory-card .equip-necklace{left:51%}.f8-inventory-card .equip-ring2{right:0}.f8-inventory-card .v5-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:4px;align-content:start;padding-top:8px;overflow:auto}.f8-inventory-card .v5-stats span{display:flex;justify-content:space-between;gap:6px;padding:5px 7px;border:1px solid #30263a;background:#0b0d16}.f8-inventory-card .v5-stats b{color:#82778b;font:8px ui-monospace,monospace}.f8-inventory-card .v5-stats em{color:#e4d5ea;font:900 9px ui-monospace,monospace;font-style:normal}
.f8-inventory-card .v5-bag-side{display:grid;grid-template-rows:35px 38px 28px minmax(0,1fr) 63px 39px;padding:10px}.f8-inventory-card .v5-currencies{display:flex;justify-content:flex-end;gap:6px}.f8-inventory-card .v5-currencies span{padding:5px 8px;border:1px solid #3a2e45;background:#0b0c14;color:#bbaac4;font:9px ui-monospace,monospace}.f8-inventory-card .v5-bag-title,.f8-bag-heading{display:flex;align-items:center;justify-content:space-between;gap:7px}.f8-inventory-card .v5-drop-button,.f8-bag-sort button,#f8-sort-bag{margin:0;padding:6px 8px;border:1px solid #553a68;background:#100e18;color:#aa9caf;font:800 8px ui-monospace,monospace}.f8-bag-sort{display:flex;gap:4px}.f8-bag-heading{color:#d9bd70;font:900 9px ui-monospace,monospace}.f8-inventory-card .f8-bag-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:7px;align-content:start;overflow:auto}.f8-inventory-card .f8-bag-grid .f8-item-slot{width:100%;aspect-ratio:1}.f8-inventory-card .v5-item-details{margin-top:5px;padding:8px;border:1px solid #30283a;background:#080a12;color:#837989;font:9px/1.35 ui-monospace,monospace;overflow:auto}.f8-inventory-card .v5-drop-zone{display:grid;place-items:center;border:1px dashed #684091;background:#0d0f1d;color:#bca9cb;font:900 8px ui-monospace,monospace}.f8-inventory-card .v5-drop-zone.drag-over{border-color:#d58cff;background:#21152d}
.f8-sheet-content{min-height:0;margin:12px 16px;padding:16px;border:1px solid #382a45;background:#070912;overflow:auto}.f8-inventory-card .v5-quick-section{padding:8px 18px 10px;border-top:1px solid #3a2a46;background:#080910}.v16-bar-heading{display:flex;justify-content:space-between;color:#8e8496;font:8px ui-monospace,monospace}.v16-action-heading{margin-top:6px}.f8-inventory-card #f8-inventory-actionbar{display:grid;grid-template-columns:repeat(8,58px);justify-content:center;gap:7px;margin-top:5px}.f8-inventory-card #f8-inventory-actionbar .f8-item-slot{width:58px;height:58px;aspect-ratio:auto}.f8-inventory-card #f8-inventory-skillbar{height:44px;display:grid;grid-template-columns:repeat(5,42px);justify-content:center;gap:6px;margin-top:3px}.f8-inventory-skill-slot{position:relative;display:grid;place-items:center;border:1px solid #54376a;background:#0d0e18;color:#8d659f}.f8-inventory-skill-slot.ready{border-color:#a05dc5;color:#e1acef;box-shadow:inset 0 0 12px #9e49ca33}.f8-inventory-skill-slot kbd{position:absolute;left:3px;top:2px;color:#85788c;font:7px ui-monospace,monospace}.f8-inventory-skill-slot b{font-size:16px}.f8-inventory-skill-slot small{position:absolute;left:2px;right:2px;bottom:2px;overflow:hidden;color:#8c8192;font:6px ui-monospace,monospace;text-align:center;white-space:nowrap}.f8-item-slot.selected{outline:2px solid #d6a757;outline-offset:-2px}

@media(max-width:1050px){.v12-class-main{grid-template-columns:240px minmax(320px,1fr) 280px}.v12-gender-grid{grid-template-columns:repeat(2,minmax(280px,390px))}.f8-inventory-card .v5-char-menu{grid-template-columns:minmax(440px,.85fr) minmax(530px,1.15fr)}.f8-inventory-card .equip-slot{width:94px}.f8-inventory-card .v5-avatar{left:98px;right:98px}.f8-inventory-card .f8-bag-grid{gap:4px}}
@media(max-width:760px){.f8-character-creator{padding:5px}.f8-creator-card{height:99vh}.v12-gender-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.v12-gender-card{height:390px}.v12-gender-card img{width:190px;height:265px}.v12-class-main{grid-template-columns:1fr}.v12-class-left,.v12-playstyle{display:none}.v12-class-footer{grid-template-columns:72px 1fr 108px;padding:7px}.v12-class-strip{gap:2px}.v12-class-choice{height:65px;padding:3px}.v12-label{font-size:7px}.f8-inventory-card{height:99vh;grid-template-rows:42px 40px minmax(0,1fr) 154px}.f8-inventory-card .v5-char-menu{grid-template-columns:1fr;overflow:auto}.f8-inventory-card .v5-character-side{min-height:610px}.f8-inventory-card .v5-bag-side{min-height:560px}.f8-inventory-card #f8-inventory-actionbar{grid-template-columns:repeat(8,minmax(38px,1fr));gap:3px}.f8-inventory-card #f8-inventory-actionbar .f8-item-slot{width:100%}}
