:root{font-size:16px;--ink-900: #1a1511;--ink-700: #2f2420;--ink-500: #4b3a32;--paper-100: #f5f0e6;--paper-200: #eee3d1;--paper-300: #e5d6c0;--accent-gold: #b98f4b;--accent-red: #7a2e24;--accent-green: #506b4a;--shadow-soft: 0 .6rem 1.4rem rgba(20, 15, 12, .18);--radius-lg: 1.2rem;--radius-md: .8rem}*{box-sizing:border-box}body{margin:0;min-height:100vh;font-family:STKaiti,KaiTi,Songti SC,"Noto Serif SC",serif;color:var(--ink-900);background:radial-gradient(circle at top,#fff8eccc,#e6d4bc99),linear-gradient(120deg,#ede3d4,#f7f0e5 55%,#e6d5be)}button{font-family:inherit}a{color:inherit;text-decoration:none}.app-shell{display:flex;flex-direction:column;min-height:100vh}.top-bar{display:flex;flex-direction:column;gap:1rem;padding:1.5rem 1.5rem 1.2rem;background:#f5f0e6e6;border-bottom:1px solid rgba(70,50,32,.15);box-shadow:var(--shadow-soft)}.brand-title{font-size:1.6rem;font-weight:700}.brand-sub{color:var(--ink-500);font-size:.9rem}.status-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(6.5rem,1fr));gap:.8rem}.status-item{background:var(--paper-100);padding:.8rem 1rem;border-radius:var(--radius-md);border:1px solid rgba(70,50,32,.12)}.status-item .label{display:block;font-size:.75rem;color:var(--ink-500)}.status-item .value{font-size:1rem;font-weight:600}.status-actions{display:flex;flex-wrap:wrap;gap:.8rem}.nav-tabs{display:flex;gap:.4rem;padding:.6rem 1rem;background:#211a16e6;color:var(--paper-100);position:sticky;top:0;z-index:10}.nav-tabs .tab{padding:.6rem 1rem;border-radius:999px;font-size:.95rem;transition:background .2s ease,color .2s ease}.nav-tabs .tab.router-link-active{background:var(--accent-gold);color:var(--ink-900)}.app-main{flex:1;padding:1.5rem}.page{display:flex;flex-direction:column;gap:1.5rem}.hero{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:1.2rem 1.6rem;border-radius:var(--radius-lg);background:linear-gradient(120deg,#b98f4b33,#7a2e241a);box-shadow:var(--shadow-soft)}.hero.compact{padding:1rem 1.4rem}.hero h1{margin:0 0 .4rem;font-size:1.5rem}.hero p{margin:0;color:var(--ink-500)}.hero-actions{display:flex;gap:.8rem}.grid{display:grid;gap:1.2rem}.grid.two-col{grid-template-columns:repeat(auto-fit,minmax(18rem,1fr))}.panel{background:var(--paper-100);border-radius:var(--radius-lg);padding:1.2rem 1.4rem;border:1px solid rgba(70,50,32,.12);box-shadow:var(--shadow-soft)}.panel-header{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-bottom:1rem}.panel-header h2{margin:0;font-size:1.2rem}.panel-sub{color:var(--ink-500);font-size:.85rem}.stat-card{background:var(--paper-100);border-radius:var(--radius-lg);padding:1.2rem 1.4rem;border:1px solid rgba(70,50,32,.12);box-shadow:var(--shadow-soft)}.stat-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:.6rem}.stat-header h3{margin:0;font-size:1.05rem}.stat-value{font-size:1.4rem;font-weight:700}.stat-slot{margin-top:.8rem}.progress{width:100%;height:.5rem;background:#46322026;border-radius:999px;overflow:hidden}.progress-bar{height:100%;background:linear-gradient(90deg,var(--accent-gold),var(--accent-red))}.action-button{min-height:2.75rem;padding:0 1.2rem;border-radius:999px;border:1px solid transparent;cursor:pointer;font-size:.95rem;transition:transform .2s ease,box-shadow .2s ease}.action-button.primary{background:var(--accent-gold);color:var(--ink-900)}.action-button.accent{background:var(--accent-red);color:var(--paper-100)}.action-button.outline{background:transparent;border-color:var(--accent-gold);color:var(--accent-red)}.action-button.ghost{background:#ffffff80;color:var(--ink-900)}.action-button:disabled{opacity:.5;cursor:not-allowed;transform:none}.action-button:not(:disabled):hover{transform:translateY(-2px);box-shadow:0 .6rem 1rem #0000001f}.badge{display:inline-flex;align-items:center;justify-content:center;padding:.25rem .6rem;border-radius:999px;background:#b98f4b33;font-size:.8rem}.muted{color:var(--ink-500);font-size:.9rem}.skill-branches{display:grid;gap:1.2rem}.skill-branch h3{margin:0 0 .6rem;font-size:1rem}.skill-list{display:grid;gap:.8rem}.skill-item{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:.8rem 1rem;background:#fff9;border-radius:var(--radius-md);border:1px solid rgba(70,50,32,.1)}.skill-title{font-weight:600}.skill-desc{font-size:.85rem;color:var(--ink-500)}.skill-meta{display:flex;align-items:center;gap:.8rem}.skill-unlocked{color:var(--accent-green);font-weight:600}.inventory-grid{display:grid;gap:.8rem}.inventory-item{padding:.8rem 1rem;border-radius:var(--radius-md);background:#fff9;border:1px solid rgba(70,50,32,.1)}.inventory-title{font-weight:600}.inventory-desc{font-size:.85rem;color:var(--ink-500);margin-top:.2rem}.inventory-meta{display:flex;justify-content:space-between;margin-top:.5rem}.virtual-list{overflow-y:auto;background:#fff6;border-radius:var(--radius-md);border:1px solid rgba(70,50,32,.1)}.virtual-spacer{position:relative;width:100%}.virtual-inner{position:absolute;left:0;right:0;top:0}.event-item{padding:.8rem 1rem;border-bottom:1px solid rgba(70,50,32,.08);display:flex;flex-direction:column;gap:.3rem}.event-title{font-weight:600}.event-desc{font-size:.85rem;color:var(--ink-500);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.event-meta{display:flex;justify-content:space-between;font-size:.75rem;color:var(--ink-500)}.recipe-list{display:grid;gap:1rem}.recipe-item{display:flex;justify-content:space-between;gap:1rem;padding:1rem;border-radius:var(--radius-md);border:1px solid rgba(70,50,32,.1);background:#ffffff80}.recipe-title{font-weight:600}.recipe-cost{margin-top:.3rem;display:flex;flex-wrap:wrap;gap:.4rem;font-size:.85rem}.recipe-actions{display:flex;flex-direction:column;align-items:flex-end;gap:.5rem}.offline-report p{margin:.2rem 0}.offline-items{display:flex;flex-wrap:wrap;gap:.4rem;margin-top:.4rem}.settings-actions{display:flex;flex-wrap:wrap;gap:.8rem}.strategy-list{margin:0;padding-left:1.2rem;display:grid;gap:.4rem;color:var(--ink-500);font-size:.9rem}.skeleton-panel{display:grid;gap:.6rem}.skeleton-title,.skeleton-line{height:.8rem;border-radius:999px;background:linear-gradient(90deg,#e6d8c4,#f4efe6,#e6d8c4);background-size:200% 100%;animation:shimmer 1.4s infinite}.skeleton-title{width:60%}.skeleton-line.short{width:40%}@keyframes shimmer{0%{background-position:0% 50%}to{background-position:100% 50%}}@media (max-width: 720px){.top-bar{padding:1.2rem 1rem}.app-main{padding:1rem}.nav-tabs{overflow-x:auto}.hero{flex-direction:column;align-items:flex-start}.recipe-item{flex-direction:column}.recipe-actions{align-items:flex-start}}