.mock{background:var(--color-canvas);color:var(--color-ink);text-align:left;-webkit-user-select:none;user-select:none;border:1px solid #fff9;border-radius:18px;grid-template-columns:188px minmax(0,1fr);font-size:12px;display:grid;overflow:hidden;box-shadow:0 0 0 6px #ffffff1f,0 24px 60px #00000038}.mock-mono{color:var(--color-text-muted);font-family:var(--font-mono);letter-spacing:.06em;text-transform:uppercase;font-size:9.5px}.mock-side{border-right:1px solid var(--color-border);background:var(--color-card);flex-direction:column;gap:14px;padding:16px 10px;display:flex}.mock-logo{align-items:center;gap:6px;padding:0 6px 6px;display:inline-flex}.mock-group{flex-direction:column;gap:2px;display:flex}.mock-group-label{color:var(--color-text-muted);padding:0 8px 4px;font-size:10px}.mock-item{color:var(--color-text-strong);border:1px solid #0000;border-radius:8px;align-items:center;gap:8px;padding:6px 8px;display:flex}.mock-item svg{color:var(--color-icon)}.mock-item.is-active{border-color:var(--color-border-strong);background:var(--color-canvas);color:var(--color-ink);font-weight:var(--weight-medium)}.mock-item.is-active svg{color:var(--color-ink)}.mock-plan{border:1px solid var(--color-border);background:radial-gradient(60% 80% at 10% 20%, #ffe7b8 0%, transparent 60%), radial-gradient(55% 80% at 80% 20%, #f6cdf0 0%, transparent 60%), radial-gradient(50% 80% at 95% 85%, #cfd8ff 0%, transparent 65%), var(--color-canvas);border-radius:10px;flex-direction:column;gap:2px;margin-top:auto;padding:10px;display:flex}.mock-plan strong{font-weight:var(--weight-regular);font-size:14px}.mock-main{min-width:0}.mock-top{border-bottom:1px solid var(--color-border);justify-content:space-between;align-items:center;gap:12px;height:44px;padding:0 16px;display:flex}.mock-crumb{color:var(--color-text-muted)}.mock-crumb strong{color:var(--color-ink);font-weight:var(--weight-medium)}.mock-search{border:1px solid var(--color-border-strong);width:180px;color:var(--color-text-muted);border-radius:8px;align-items:center;gap:6px;padding:5px 10px;display:inline-flex}.mock-page{flex-direction:column;gap:12px;padding:16px;display:flex}.mock-hello{flex-direction:column;display:flex}.mock-hello strong{font-size:20px;font-weight:var(--weight-regular);letter-spacing:-.02em}.mock-hello span{color:var(--color-text-muted)}.mock-tiles{grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;display:grid}.mock-tile,.mock-panel{background:var(--color-card);border-radius:12px;flex-direction:column;min-width:0;padding:3px;display:flex}.mock-tile-body,.mock-panel-body{border:1px solid var(--color-border);background:var(--color-canvas);border-radius:9px;flex-direction:column;gap:6px;padding:10px;display:flex}.mock-value{font-family:var(--font-mono);white-space:nowrap;font-size:17px}.mock-change{color:var(--color-text-muted);align-items:center;gap:3px;padding:5px 8px 3px;font-size:10px;display:inline-flex}.mock-change svg{color:var(--color-success)}.mock-row{grid-template-columns:minmax(0,1.65fr) minmax(0,1fr);gap:8px;display:grid}.mock-panel>.mock-mono{padding:7px 8px}.mock-panel-body{flex:1}.mock-total{color:var(--color-text-muted)}.mock-total strong{color:var(--color-ink);font-family:var(--font-mono);font-size:15px;font-weight:var(--weight-regular);margin-left:6px}.mock-dots{grid-template-columns:repeat(12,minmax(0,1fr));gap:5px;margin-top:4px;display:grid}.mock-col{flex-direction:column;align-items:center;gap:4px;display:flex}.mock-stack{grid-template-rows:repeat(10,1fr);gap:2px;width:100%;display:grid}.mock-stack span{aspect-ratio:2.2;background:var(--color-raised);border-radius:1.5px}.mock-stack span.on{background:var(--color-ink)}.mock-col.is-now .mock-stack span.on{background:var(--color-primary-hover)}.mock-month{color:var(--color-text-muted);font-family:var(--font-mono);font-size:9px}.mock-col.is-now .mock-month{color:var(--color-ink);font-weight:var(--weight-medium)}.mock-tip{background:var(--color-card);border-radius:8px;align-items:flex-start;gap:8px;padding:8px;display:flex}.mock-tip strong{font-weight:var(--weight-medium);display:block}.mock-tip-icon{background:var(--color-canvas);width:22px;height:22px;box-shadow:var(--shadow-whisper);color:var(--color-primary-hover);border-radius:6px;flex-shrink:0;justify-content:center;align-items:center;display:inline-flex}.mock-tip-action{color:var(--color-text-muted);align-items:center;gap:3px;font-size:11px;display:inline-flex}.mock-figure{color:var(--color-text-muted);justify-content:space-between;gap:8px;padding:4px 0;display:flex}.mock-figure strong{color:var(--color-ink);font-family:var(--font-mono);font-weight:var(--weight-regular)}@media (width<=899px){.mock{grid-template-columns:minmax(0,1fr)}.mock-side{display:none}}@media (width<=599px){.mock-tiles{grid-template-columns:repeat(2,minmax(0,1fr))}.mock-row{grid-template-columns:minmax(0,1fr)}.mock-search,.mock-overall .mock-figure:nth-of-type(n+3){display:none}}
