*{box-sizing:border-box}html,body{margin:0;padding:0}body{font-family:Arial,"Microsoft YaHei",sans-serif;background:linear-gradient(180deg,#081120 0%,#0f172a 100%);color:#e5e7eb;min-height:100vh}a{color:#bfdbfe;text-decoration:none}img{max-width:100%}button,input,select,textarea{font:inherit}
body.app-mode{padding:0 0 calc(82px + env(safe-area-inset-bottom))}
.app-shell{max-width:860px;margin:0 auto;padding:16px 14px 28px}
.panel,.card,.item-row,.app-hero,.player-panel,.monster-card{background:rgba(12,18,32,.95);border:1px solid #23324a;border-radius:20px;box-shadow:0 14px 38px rgba(0,0,0,.28)}
.panel{padding:16px;margin-bottom:16px}.card,.item-row,.monster-card{padding:14px;margin-bottom:12px}.compact-card{padding:12px}.card-glow{box-shadow:0 18px 42px rgba(37,99,235,.18),0 0 0 1px rgba(96,165,250,.12) inset}
.app-topbar{position:sticky;top:0;z-index:40;padding:14px 14px 8px;background:rgba(8,17,32,.88);backdrop-filter:blur(14px);border-bottom:1px solid rgba(148,163,184,.14)}
.app-topbar-row,.player-summary,.section-head,.monster-main,.item-row,.app-item-row,.actions,.inline,.hero-stats,.app-top-actions,.player-quickbar{display:flex;gap:10px;align-items:center}.app-topbar-row,.player-summary,.section-head,.monster-main,.item-row,.app-item-row{justify-content:space-between}.app-brand{font-weight:700;font-size:20px}.app-subtitle,.muted{color:#94a3b8;font-size:12px}.player-quickbar{margin-top:10px;flex-wrap:wrap}.chip,.badge{display:inline-flex;align-items:center;justify-content:center;padding:6px 10px;border-radius:999px;background:#162338;color:#dbeafe;font-size:12px;border:1px solid rgba(147,197,253,.18)}.chip-primary,.badge{background:#1d4ed8;color:#fff}.badge-soft{background:#132033}.badge-success{background:#166534}.badge-danger{background:#991b1b}.icon-btn,.btn{appearance:none;border:none;border-radius:14px;padding:12px 15px;background:#2563eb;color:#fff;cursor:pointer;font-weight:600}.btn:hover,.icon-btn:hover{filter:brightness(1.08)}.btn-secondary{background:#374151}.btn-ghost{background:#111827;border:1px solid #334155}.btn-small{padding:8px 12px;font-size:12px;border-radius:12px}.btn-block{width:100%}.btn:disabled{opacity:.45;cursor:not-allowed}
.app-tabbar{position:fixed;left:0;right:0;bottom:0;z-index:50;display:grid;grid-template-columns:repeat(4,1fr);gap:8px;padding:10px 14px calc(10px + env(safe-area-inset-bottom));background:rgba(8,17,32,.96);backdrop-filter:blur(18px);border-top:1px solid rgba(148,163,184,.14)}
.tab-item{padding:11px 8px;border-radius:16px;text-align:center;background:#0f172a;color:#cbd5e1;font-size:13px;font-weight:700}.tab-item.active{background:#1d4ed8;color:#fff;box-shadow:0 10px 24px rgba(37,99,235,.35)}
.eyebrow{display:inline-block;padding:4px 8px;border-radius:999px;background:#111827;color:#93c5fd;font-size:11px;font-weight:700;letter-spacing:.08em}.app-hero{padding:18px;display:grid;gap:16px;margin-bottom:16px}.app-hero h1,.panel h1,.panel h2,.panel h3{margin:0 0 10px}.app-hero p{margin:0;color:#cbd5e1;line-height:1.6}.hero-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.hero-stat{padding:14px;border-radius:16px;background:#101a2d;border:1px solid #22314b;text-align:center}.hero-stat strong{display:block;font-size:22px;color:#fff}.section-grid{display:grid;gap:16px}.section-grid-stack{grid-template-columns:1fr}.app-list{margin:0;padding-left:18px;display:grid;gap:8px}
.auth-shell{min-height:calc(100vh - 120px);display:flex;align-items:center}.auth-card{max-width:480px;margin:0 auto}.auth-foot{text-align:center;margin-top:8px}.app-form,.full-form{display:flex;flex-direction:column;gap:12px}.app-form label,.full-form label{display:grid;gap:6px;font-size:13px;color:#cbd5e1}.app-form input,.app-form select,.app-form textarea,.full-form input,.full-form select,.full-form textarea,.panel input,.panel select,.panel textarea{width:100%;padding:12px;border-radius:14px;border:1px solid #334155;background:#020617;color:#fff}
.alert{padding:12px 14px;border-radius:14px;margin-bottom:14px}.alert.success{background:#14532d}.alert.error{background:#7f1d1d}.resource-stack,.stat-upgrade-grid,.avatar-grid,.module-grid,.section-grid{display:grid;gap:12px}.resource-stack{grid-template-columns:repeat(2,1fr)}.resource-card,.stat-upgrade-card,.avatar-card{padding:12px;border-radius:16px;background:#101a2d;border:1px solid #22314b}.resource-card span{display:block;color:#94a3b8;font-size:12px}.resource-card strong{font-size:18px;color:#fff}.stat-upgrade-grid{grid-template-columns:repeat(2,1fr)}.stat-upgrade-card{display:flex;justify-content:space-between;align-items:center;gap:8px}.avatar-grid{grid-template-columns:repeat(2,1fr)}.avatar-card{text-align:center}.avatar-card.selected{border-color:#3b82f6;box-shadow:0 0 0 1px rgba(59,130,246,.2) inset}.avatar-badge{width:54px;height:54px;border-radius:18px;margin:0 auto 10px;display:flex;align-items:center;justify-content:center;background:#1d4ed8;font-size:24px;font-weight:700}.app-inline-form{justify-content:center}
.map-strip{display:flex;gap:10px;overflow:auto;padding:0 2px 12px;margin-bottom:8px}.map-chip-form{flex:0 0 auto}.map-chip{appearance:none;border:none;padding:12px 14px;border-radius:999px;background:#0f172a;border:1px solid #23324a;color:#cbd5e1;font-weight:700;cursor:pointer}.map-chip.active{background:#1d4ed8;color:#fff}.sticky-head{position:sticky;top:82px;background:rgba(8,17,32,.92);backdrop-filter:blur(10px);padding:8px 0 10px;margin-bottom:0;z-index:20}.monster-stack{display:grid;gap:12px;margin-bottom:16px}.battle-form{margin-top:10px}.battle-log{display:grid;gap:8px;background:#020617;padding:12px;border-radius:14px;border:1px solid #243244}.app-item-row{align-items:flex-start}.module-grid{grid-template-columns:1fr}.item-row strong,.card strong,.monster-card strong{color:#f8fafc}.notice{padding:10px 0}.actions{flex-wrap:wrap}.section-head{margin-bottom:10px}
ol,ul{margin:8px 0 0 18px;padding:0}table{width:100%;border-collapse:collapse}th,td{border-bottom:1px solid #1f2937;padding:10px;text-align:left;vertical-align:top}
.admin-layout{display:grid;grid-template-columns:240px 1fr;gap:18px}.admin-menu a{display:block;padding:10px 12px;border-radius:10px;background:#0b1220;margin-bottom:8px}
.topbar{display:flex;justify-content:space-between;align-items:center;padding:12px 20px;background:#020617;border-bottom:1px solid #1e293b;position:sticky;top:0;z-index:10}
.layout{max-width:1380px;margin:0 auto;padding:20px}.grid{display:grid;gap:18px}.grid.two{grid-template-columns:1fr 1fr}.grid.three{grid-template-columns:repeat(3,1fr)}.grid.four{grid-template-columns:repeat(4,1fr)}.game-layout{display:grid;grid-template-columns:290px 1fr;gap:18px}.stats{display:grid;gap:6px;margin-bottom:12px}.sidebar h3{margin-top:18px}.main section:last-child{margin-bottom:0}.ran-desktop .sidebar{position:sticky;top:74px;height:fit-content}.ran-hero{background:linear-gradient(135deg,rgba(30,41,59,.95),rgba(30,64,175,.18));border-color:#3b82f6}.compact{padding:10px}.mini-grid{display:grid;gap:8px}.stat-grid form{margin:0}
@media (min-width:720px){.app-shell{padding:18px 18px 32px}.resource-stack{grid-template-columns:repeat(3,1fr)}.avatar-grid,.module-grid,.section-grid-stack{grid-template-columns:repeat(2,1fr)}.monster-stack{grid-template-columns:repeat(2,1fr)}}
@media (min-width:1040px){body.app-mode{padding-bottom:32px}.app-shell{max-width:1280px;padding:24px 24px 40px}.app-tabbar{position:sticky;top:74px;left:auto;right:auto;bottom:auto;max-width:1280px;margin:0 auto;padding:0 24px 10px;background:transparent;border-top:none;grid-template-columns:repeat(4,minmax(0,180px));justify-content:start}.tab-item{background:rgba(15,23,42,.88)}.game-shell{display:grid;grid-template-columns:380px 1fr;gap:18px;align-items:start}.game-shell > .alert,.game-shell > .combat-result,.game-shell > .map-strip,.game-shell > .sticky-head,.game-shell > .monster-stack,.game-shell > .module-grid{grid-column:2}.game-shell > .player-panel{grid-column:1;grid-row:1 / span 6;position:sticky;top:126px}.module-grid{grid-template-columns:repeat(2,1fr)}.avatar-grid,.section-grid-stack{grid-template-columns:repeat(2,1fr)}.resource-stack{grid-template-columns:repeat(2,1fr)}.app-hero{grid-template-columns:1.4fr .8fr}.app-topbar{padding:18px 24px 10px}}


/* ===== v4.3.0 Home & Character Upgrade ===== */
.home-upgrade-shell,.character-upgrade-shell{position:relative}
.eyebrow-gold{background:rgba(245,158,11,.12);color:#fcd34d;border:1px solid rgba(251,191,36,.22)}
.hero-cinematic,.character-hero{position:relative;overflow:hidden;border-radius:28px;padding:22px;background:linear-gradient(180deg,rgba(9,15,28,.96),rgba(12,24,44,.94));border:1px solid rgba(96,165,250,.18)}
.hero-cinematic__bg,.character-hero__bg{position:absolute;inset:0;pointer-events:none}
.orb,.flare{position:absolute;display:block;border-radius:999px;filter:blur(8px);opacity:.6}
.orb-a{width:220px;height:220px;right:-40px;top:-30px;background:radial-gradient(circle,rgba(96,165,250,.32),rgba(96,165,250,0))}
.orb-b{width:260px;height:260px;left:-60px;bottom:-80px;background:radial-gradient(circle,rgba(251,191,36,.22),rgba(251,191,36,0))}
.grid-lines,.scanline{position:absolute;inset:0;background-image:linear-gradient(rgba(148,163,184,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(148,163,184,.06) 1px,transparent 1px);background-size:26px 26px;mask-image:linear-gradient(180deg,rgba(0,0,0,.85),transparent)}
.hero-cinematic__content,.character-hero__head{position:relative;z-index:1;display:grid;gap:16px}
.hero-copy--wide h1,.character-hero h1{font-size:clamp(30px,6vw,48px);line-height:1.06;margin:10px 0 12px;color:#fff}
.hero-copy--wide p,.character-hero p{max-width:760px;color:#cbd5e1;line-height:1.72}
.hero-command{display:grid;gap:12px}
.hero-command__panel{padding:16px 18px;border-radius:22px;background:linear-gradient(135deg,rgba(20,33,56,.92),rgba(10,18,32,.92));border:1px solid rgba(96,165,250,.18);box-shadow:0 18px 40px rgba(2,6,23,.45)}
.hero-command__label{font-size:11px;letter-spacing:.1em;color:#93c5fd;margin-bottom:8px}
.hero-command__panel strong{display:block;font-size:22px;color:#fff}
.hero-command__panel span{display:block;margin-top:6px;color:#94a3b8}
.hero-command__stats{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.hero-command__stat,.character-status-chip{padding:14px;border-radius:18px;background:rgba(9,15,28,.72);border:1px solid rgba(148,163,184,.12);text-align:center;backdrop-filter:blur(8px)}
.hero-command__stat strong,.character-status-chip strong{display:block;color:#fff;font-size:20px}
.hero-command__stat span,.character-status-chip span{display:block;margin-top:6px;color:#94a3b8;font-size:12px}
.hero-cta{position:relative;z-index:1;margin-top:18px}
.home-showcase-grid{grid-template-columns:1fr}
.intel-stack,.portal-list,.world-entry-grid,.character-card-grid,.class-preview-grid{display:grid;gap:12px}
.intel-card,.portal-item,.world-entry-card,.class-preview-card,.character-lobby-card,.empty-state-panel,.create-form-tip{position:relative;padding:16px;border-radius:20px;background:linear-gradient(180deg,rgba(13,20,36,.94),rgba(9,15,28,.94));border:1px solid rgba(71,85,105,.42)}
.intel-card strong,.portal-item strong,.world-entry-card strong,.class-preview-card strong,.character-lobby-card strong,.empty-state-panel strong,.create-form-tip strong{display:block;color:#f8fafc}
.intel-card p,.portal-item p,.world-entry-card p,.class-preview-card p,.empty-state-panel p,.create-form-tip p{margin:8px 0 0;color:#94a3b8;line-height:1.65}
.portal-item{display:grid;grid-template-columns:56px 1fr;gap:14px;align-items:flex-start}
.portal-step{display:flex;align-items:center;justify-content:center;width:56px;height:56px;border-radius:18px;background:linear-gradient(135deg,#1d4ed8,#2563eb);color:#fff;font-weight:800;box-shadow:0 14px 32px rgba(37,99,235,.32)}
.home-world-panel{overflow:hidden}
.world-entry-card{min-height:170px;background:linear-gradient(180deg,rgba(11,19,34,.95),rgba(15,31,58,.92))}
.world-entry-card__tag{display:inline-flex;align-items:center;padding:6px 10px;border-radius:999px;border:1px solid rgba(251,191,36,.24);background:rgba(245,158,11,.1);color:#fcd34d;font-size:12px;font-weight:700;margin-bottom:12px}
.notice-timeline{display:grid;gap:12px}
.notice-timeline__item{display:grid;grid-template-columns:18px 1fr;gap:12px;align-items:flex-start;padding:14px 16px}
.notice-timeline__dot{width:10px;height:10px;border-radius:999px;background:#60a5fa;box-shadow:0 0 0 6px rgba(96,165,250,.12);margin-top:7px}
.notice-timeline__body p{margin:8px 0 0;color:#cbd5e1;line-height:1.7}
.character-hero{margin-bottom:16px}
.flare-a{width:260px;height:260px;right:-60px;top:-90px;background:radial-gradient(circle,rgba(59,130,246,.3),rgba(59,130,246,0))}
.flare-b{width:220px;height:220px;left:-50px;bottom:-70px;background:radial-gradient(circle,rgba(168,85,247,.26),rgba(168,85,247,0))}
.character-hero__status{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}
.class-preview-card{overflow:hidden}
.class-preview-card__top{display:flex;align-items:center;gap:12px;margin-bottom:12px}
.class-icon{display:flex;align-items:center;justify-content:center;width:52px;height:52px;border-radius:16px;background:linear-gradient(135deg,rgba(37,99,235,.28),rgba(30,41,59,.85));font-size:24px;font-weight:800;color:#fff;border:1px solid rgba(96,165,250,.22)}
.class-preview-card__top span{display:block;color:#93c5fd;font-size:12px;margin-top:4px}
.class-stat-row{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.class-stat-row span,.character-lobby-card__stats span{display:inline-flex;align-items:center;padding:7px 10px;border-radius:999px;background:#111827;border:1px solid rgba(71,85,105,.5);color:#dbeafe;font-size:12px}
.class-preview-card--swordsman{background:linear-gradient(180deg,rgba(31,41,55,.94),rgba(59,23,23,.9))}
.class-preview-card--gunner{background:linear-gradient(180deg,rgba(11,18,32,.94),rgba(20,83,45,.88))}
.class-preview-card--mage{background:linear-gradient(180deg,rgba(17,24,39,.94),rgba(67,56,202,.88))}
.character-main-grid{align-items:start}
.character-card-grid{grid-template-columns:1fr}
.character-lobby-card{display:grid;gap:14px;padding:16px}
.character-lobby-card.selected{border-color:rgba(96,165,250,.65);box-shadow:0 18px 36px rgba(37,99,235,.22),0 0 0 1px rgba(96,165,250,.18) inset}
.character-lobby-card__head{display:grid;grid-template-columns:auto 1fr auto;gap:12px;align-items:center}
.avatar-badge--immersive{background:linear-gradient(135deg,#2563eb,#4f46e5);box-shadow:0 16px 30px rgba(37,99,235,.28)}
.character-bars{display:grid;gap:10px}
.status-bar{display:grid;gap:6px}
.status-bar__meta{display:flex;justify-content:space-between;gap:8px;font-size:12px;color:#cbd5e1}
.status-bar__track{position:relative;height:10px;border-radius:999px;background:#0b1220;border:1px solid rgba(71,85,105,.48);overflow:hidden}
.status-bar__fill{position:absolute;left:0;top:0;bottom:0;border-radius:999px}
.status-bar__fill--hp{background:linear-gradient(90deg,#22c55e,#16a34a)}
.status-bar__fill--mp{background:linear-gradient(90deg,#38bdf8,#2563eb)}
.immersive-create-form{gap:14px}
.create-form-tip{padding:14px 16px;background:linear-gradient(180deg,rgba(30,41,59,.88),rgba(15,23,42,.94))}
@media (min-width:720px){
  .home-showcase-grid,.world-entry-grid,.class-preview-grid,.character-card-grid{grid-template-columns:repeat(2,1fr)}
  .hero-cinematic__content,.character-hero__head{grid-template-columns:1.4fr .8fr;align-items:end}
}
@media (min-width:1040px){
  .home-showcase-grid{grid-template-columns:1.05fr .95fr}
  .world-entry-grid{grid-template-columns:repeat(3,1fr)}
  .class-preview-grid{grid-template-columns:repeat(3,1fr)}
  .character-main-grid{grid-template-columns:1.15fr .85fr}
  .character-card-grid{grid-template-columns:repeat(2,1fr)}
  .hero-cinematic,.character-hero{padding:28px}
}


.grid-two-fit{grid-template-columns:minmax(320px,1.3fr) minmax(260px,.9fr)}
.grid-editor-card{padding:14px;border-radius:18px;background:linear-gradient(180deg,rgba(13,20,36,.94),rgba(9,15,28,.96));border:1px solid rgba(71,85,105,.45)}
.grid-editor-head{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;margin-bottom:10px}.grid-editor-head strong{display:block;color:#f8fafc}.grid-editor-head span{display:block;color:#94a3b8;font-size:12px;line-height:1.6}
.grid-editor-meta{font-size:12px;color:#93c5fd;margin-bottom:10px}
.grid-editor-board{display:grid;grid-template-columns:repeat(var(--grid-cols,12),minmax(12px,1fr));gap:3px;background:#08111f;padding:10px;border-radius:14px;border:1px solid rgba(59,130,246,.18);max-height:420px;overflow:auto}
.grid-editor-cell{appearance:none;border:none;min-width:12px;min-height:12px;aspect-ratio:1/1;border-radius:4px;background:#132033;box-shadow:inset 0 0 0 1px rgba(71,85,105,.28);cursor:pointer;transition:transform .12s ease, box-shadow .12s ease, background .12s ease}
.grid-editor-cell:hover{transform:translateY(-1px);box-shadow:inset 0 0 0 1px rgba(148,163,184,.45),0 4px 10px rgba(2,6,23,.24)}
.grid-editor-cell.is-occupied{background:#334155}.grid-editor-cell.is-slot{background:#5b4a17}.grid-editor-cell.is-selected{background:#2563eb;box-shadow:inset 0 0 0 1px rgba(191,219,254,.85),0 0 0 1px rgba(37,99,235,.35)}.grid-editor-cell.is-conflict{background:#dc2626;box-shadow:inset 0 0 0 1px rgba(254,202,202,.95),0 0 0 1px rgba(220,38,38,.3)}
.grid-editor-status{padding:12px 14px;border-radius:14px;font-weight:700;margin-bottom:10px}.grid-editor-status.is-neutral{background:#111827;color:#cbd5e1;border:1px solid rgba(71,85,105,.45)}.grid-editor-status.is-safe{background:rgba(22,163,74,.12);color:#86efac;border:1px solid rgba(34,197,94,.28)}.grid-editor-status.is-danger{background:rgba(153,27,27,.18);color:#fecaca;border:1px solid rgba(239,68,68,.28)}
.grid-editor-list{margin:0;padding-left:18px;display:grid;gap:8px;color:#cbd5e1}.grid-editor-empty{padding:16px;color:#94a3b8}
button[data-grid-editor-submit][disabled]{opacity:.58;cursor:not-allowed;filter:grayscale(.15)}
@media (max-width:900px){.grid-two-fit{grid-template-columns:1fr}}