:root{--bg-app-a: #131e28;--bg-app-b: #0a0e13;--bg-app-c: #070a0e;--bg-screen-a: #0b1117;--bg-screen-b: #0a0f14;--panel: linear-gradient(160deg, #182029, #121922);--panel-alt: linear-gradient(160deg, #161d26, #121820);--border: #263440;--border-2: #28323d;--border-strong: #33475a;--gold: #f0c14b;--gold-bright: #ffd76a;--cyan: #46d5c6;--green: #8fd15a;--red: #e5573f;--purple: #b98cff;--blue: #5aa9ff;--pink: #ff8fb0;--orange: #ffb454;--text-hi: #eef4f8;--text-mid: #9fb2c0;--text-low: #6b7d8c;--text-body: #cdd9e2;--text-caption: #8298a8;--nav-inactive: #5f7484;--font-display: "Cinzel", serif;--font-body: "Chakra Petch", sans-serif}*{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent}html,body,#root{height:100%}body{font-family:var(--font-body);background:radial-gradient(120% 90% at 20% 0%,var(--bg-app-a) 0%,var(--bg-app-b) 55%,var(--bg-app-c) 100%);color:var(--text-body);overflow:hidden}button{font-family:inherit}a{color:var(--gold)}a:hover{color:var(--gold-bright)}.af-scroll{scrollbar-width:none}.af-scroll::-webkit-scrollbar{width:0;height:0}@keyframes afFloat{0%{opacity:0;transform:translateY(6px) scale(.9)}15%{opacity:1;transform:translateY(0) scale(1)}to{opacity:0;transform:translateY(-52px) scale(1)}}@keyframes afBurst{0%{opacity:0;transform:scale(.6)}25%{opacity:1;transform:scale(1.06)}80%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(1.04)}}@keyframes afRing{0%{transform:scale(.7);opacity:.8}to{transform:scale(2.1);opacity:0}}@keyframes afMarch{0%{width:4%}to{width:100%}}@keyframes afClash{0%,to{transform:translate(0)}50%{transform:translate(10px) rotate(6deg)}}@keyframes afClashL{0%,to{transform:translate(0)}50%{transform:translate(-10px) rotate(-6deg)}}@keyframes afDrift{0%{transform:translate(0)}50%{transform:translate(-3%,2%)}to{transform:translate(0)}}@keyframes afSheet{0%{transform:translateY(100%)}to{transform:translateY(0)}}.app-backdrop{position:relative;min-height:100dvh;width:100%;display:grid;place-items:center;overflow:hidden}.app-backdrop:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:radial-gradient(40% 30% at 80% 15%,rgba(70,213,198,.1),transparent 70%),radial-gradient(45% 35% at 12% 80%,rgba(240,193,75,.08),transparent 70%);animation:afDrift 18s ease-in-out infinite;pointer-events:none}.app-frame{position:relative;width:100%;height:100dvh;background:#0c1218;display:flex;flex-direction:column;overflow:hidden}@media (min-width: 600px){.app-backdrop{padding:28px 12px}.app-frame{width:390px;height:812px;border:1px solid #2c3b48;border-radius:44px;box-shadow:0 40px 90px -20px #000c,inset 0 0 0 6px #060a0e}}.status-bar{height:44px;flex:none;display:flex;align-items:center;justify-content:space-between;padding:0 22px;color:#cdd9e2;font-size:13px;font-weight:600;z-index:5;background:linear-gradient(#0e161d,#0c1218)}.screen-area{position:relative;flex:1;overflow-y:auto;background:linear-gradient(var(--bg-screen-a),var(--bg-screen-b))}.screen{padding:16px 15px 24px}.bottom-nav{height:66px;flex:none;display:flex;align-items:stretch;background:linear-gradient(#0e161d,#0a1015);border-top:1px solid #1e2a34;z-index:45}.bottom-nav button{flex:1;cursor:pointer;background:none;border:none;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px}.bottom-nav button span{font-size:8.5px;font-weight:600}.floaters{position:absolute;top:96px;left:0;right:0;text-align:center;pointer-events:none;z-index:40}.floater{display:inline-block;font-family:var(--font-display);font-weight:800;font-size:20px;text-shadow:0 2px 10px rgba(0,0,0,.7);animation:afFloat 1.15s ease-out forwards;padding:2px 4px}.btn-press:active{transform:scale(.98)}.card{background:var(--panel);border:1px solid var(--border);border-radius:13px}.card-alt{background:var(--panel-alt);border:1px solid var(--border);border-radius:14px}.grid-resources{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.grid-skills{display:grid;grid-template-columns:repeat(2,1fr);gap:9px}.grid-quick{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.grid-clan-stats{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}.list-col{display:flex;flex-direction:column;gap:9px}@media (min-width: 900px){.grid-resources{grid-template-columns:repeat(3,minmax(140px,1fr))}.grid-skills{grid-template-columns:repeat(4,minmax(190px,1fr))}.grid-quick{grid-template-columns:repeat(3,minmax(150px,1fr));max-width:520px}.grid-clan-stats{grid-template-columns:repeat(2,minmax(200px,1fr));max-width:520px}.list-col.list-2col{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;align-items:start}.world-map{height:560px!important;max-width:900px;margin:0 auto}}.status-menu-btn{padding:4px 2px}.status-menu{position:absolute;top:26px;right:0;min-width:150px;background:var(--panel);border:1px solid var(--border-strong);border-radius:12px;padding:10px;box-shadow:0 12px 30px -8px #000000b3;z-index:70;text-align:left}.status-menu-user{font-size:11px;color:var(--text-mid);font-weight:600;padding:2px 4px 8px;border-bottom:1px solid var(--border);margin-bottom:8px;word-break:break-word}.status-menu button{width:100%;cursor:pointer;background:#1c2836;border:1px solid var(--border-strong);border-radius:8px;padding:8px 10px;color:var(--text-body);font-size:12px;font-weight:600}.skill-locked-card{cursor:pointer;text-align:left;border-radius:15px;padding:12px;display:flex;align-items:center;gap:10px;opacity:.75}.skill-locked-card:disabled{cursor:not-allowed}.skill-locked-badge{width:38px;height:38px;flex:none;border-radius:11px;background:#1a222c;border:1px dashed var(--border-strong);display:grid;place-items:center;font-size:15px}.auth-backdrop{height:100dvh;padding:40px 16px;overflow-y:auto;align-items:start}.auth-card{width:100%;max-width:380px;background:var(--panel);border:1px solid var(--border-strong);border-radius:22px;padding:28px 24px 26px;position:relative;box-shadow:0 30px 70px -20px #000000b3}.create-card{max-width:460px}.auth-title{font-family:var(--font-display);font-weight:900;font-size:26px;letter-spacing:3px;color:var(--gold);text-align:center}.auth-subtitle{text-align:center;font-size:12px;color:var(--text-caption);margin-top:6px;margin-bottom:22px}.auth-tabs{display:flex;gap:6px;background:#0d151c;border:1px solid var(--border);border-radius:12px;padding:4px;margin-bottom:18px}.auth-tabs button{flex:1;cursor:pointer;background:none;border:none;border-radius:9px;padding:9px 0;color:var(--text-low);font-size:12.5px;font-weight:700}.auth-tabs button.active{background:var(--panel-alt);color:var(--gold)}.auth-form{display:flex;flex-direction:column;gap:14px}.auth-label{display:flex;flex-direction:column;gap:6px;font-size:11px;color:var(--text-caption);letter-spacing:.3px}.auth-input{background:#0d151c;border:1px solid var(--border);border-radius:10px;padding:11px 12px;color:var(--text-hi);font-size:14px;font-family:inherit}.auth-input:focus{outline:none;border-color:var(--gold)}.auth-error{font-size:11.5px;color:var(--red);background:#1c1210;border:1px solid #3a2420;border-radius:8px;padding:8px 10px}.auth-submit{cursor:pointer;font-weight:800;font-size:14px;color:#1a1206;background:linear-gradient(90deg,#f0c14b,#ffd76a);border:none;border-radius:12px;padding:13px;box-shadow:0 8px 22px -6px #f0c14b80}.auth-submit:disabled{opacity:.5;cursor:not-allowed;box-shadow:none}.auth-note{text-align:center;font-size:10px;color:var(--text-low);margin-top:16px}.auth-tabs-back{cursor:pointer;background:#182531;border:1px solid var(--border-strong);border-radius:12px;padding:13px;color:var(--text-body);font-weight:700;font-size:13px;flex:1}.create-step{display:flex;flex-direction:column}.title-list{display:flex;flex-direction:column;gap:6px;margin-top:6px}.title-option{cursor:pointer;text-align:left;background:#0d151c;border:1px solid var(--border);border-radius:10px;padding:9px 12px;color:var(--text-mid);font-size:12.5px}.title-option.active{border-color:var(--gold);color:var(--gold);background:#201705}.swatch-row{display:flex;gap:10px;margin-top:6px}.swatch{width:34px;height:34px;border-radius:10px;border:2px solid transparent;cursor:pointer}.swatch.active{border-color:var(--text-hi)}.create-preview{width:56px;height:56px;border-radius:14px;margin:20px auto 0;display:grid;place-items:center;font-family:var(--font-display);font-weight:900;font-size:24px;color:#1a1206}.create-actions{display:flex;gap:10px;margin-top:18px}.create-actions .auth-submit{flex:2}.skill-pick-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-top:8px}.skill-pick-card{position:relative;cursor:pointer;text-align:left;background:var(--panel-alt);border:1px solid var(--border);border-radius:13px;padding:11px;display:flex;flex-direction:column;gap:6px}.skill-pick-card.active{border-color:var(--gold);background:#1c1710}.skill-pick-card.disabled{opacity:.4;cursor:not-allowed}.skill-pick-badge{width:32px;height:32px;border-radius:9px;display:grid;place-items:center;font-family:var(--font-display);font-weight:800;font-size:14px;color:#0c1218}.skill-pick-name{font-size:12.5px;font-weight:700;color:var(--text-hi)}.skill-pick-blurb{font-size:10px;color:var(--text-low);line-height:1.3}.skill-pick-check{position:absolute;top:10px;right:10px;color:var(--gold);font-weight:800}@media (min-width: 640px){.skill-pick-grid{grid-template-columns:repeat(4,1fr)}}.desktop-shell{display:flex;width:100%;height:100dvh;background:linear-gradient(var(--bg-screen-a),var(--bg-screen-b))}.sidebar{width:232px;flex:none;display:flex;flex-direction:column;background:linear-gradient(#0e161d,#0a1015);border-right:1px solid #1e2a34;padding:20px 14px}.sidebar-logo{font-family:var(--font-display);font-weight:800;letter-spacing:3px;font-size:16px;color:var(--gold);padding:0 8px;margin-bottom:28px}.sidebar-nav{display:flex;flex-direction:column;gap:4px;flex:1}.sidebar-nav button{display:flex;align-items:center;gap:12px;cursor:pointer;background:none;border:none;border-radius:10px;padding:11px 12px;color:var(--nav-inactive);font-size:13px;font-weight:600;text-align:left}.sidebar-nav button:hover{background:#131b23;color:var(--text-body)}.sidebar-nav button.active{background:#201a08;color:var(--gold)}.sidebar-footer{padding-top:14px;border-top:1px solid #1e2a34;display:flex;flex-direction:column;gap:8px}.sidebar-account{font-size:11.5px;color:var(--text-mid);padding:0 8px;word-break:break-word}.sidebar-logout{cursor:pointer;background:#1c2836;border:1px solid var(--border-strong);border-radius:10px;padding:9px;color:var(--text-body);font-size:12px;font-weight:600}.desktop-main{position:relative;flex:1;display:flex;flex-direction:column;min-width:0}.desktop-header{flex:none;display:flex;gap:10px;padding:16px 28px;border-bottom:1px solid #1a242d}.dh-pill{background:var(--panel-alt);border:1px solid var(--border);border-radius:20px;padding:8px 14px;font-size:13px;font-weight:700;display:flex;align-items:baseline;gap:6px}.dh-pill span{font-size:9.5px;font-weight:600;letter-spacing:.5px;color:var(--text-low)}.desktop-content{flex:1;overflow-y:auto;padding:8px 28px 40px}.desktop-content .screen{max-width:1080px;margin:0 auto;padding:16px 0 24px}.desktop-content .floaters,.desktop-content~.floaters{top:76px}