:root {
    color-scheme: light;
    --rosa-50: #fff6fa;
    --rosa-100: #fceaf1;
    --rosa-200: #f4d3e0;
    --rosa-300: #ff8fb8;
    --rosa-500: #ff6fa5;
    --rosa-600: #f5559a;
    --cream: #fffbfc;
    --bg: #fbf3f7;
    --paper: #ffffff;
    --ink: #3a2a33;
    --ink-2: #5a4650;
    --muted: #9b7e8c;
    --muted-2: #c58aa2;
    --line: #f2e2ea;
    --line-2: #fbe3ec;
    --roxo-400: #9c7ce8;
    --roxo-600: #7c5fbf;
    --roxo-bg: #f3eafb;
    --ok: #15803d;
    --ok-bg: #dcf6e6;
    --warn: #b45309;
    --warn-bg: #fdebc8;
    --danger: #e0557a;
    --danger-bg: #fde3ea;
    --grad-rosa: linear-gradient(135deg, #ff8fb8, #ff6fa5 60%, #f5559a);
    --grad-btn: linear-gradient(180deg, #ff85b0, #ff5c99);
    --grad-ia: linear-gradient(135deg, #9c7ce8, #7c5fbf);
    --ph-1: linear-gradient(135deg, #ffd7e6, #ffb8d2);
    --ph-2: linear-gradient(135deg, #fce2d0, #f7c6a8);
    --ph-3: linear-gradient(135deg, #e7dbff, #c9b6f2);
    --ph-4: linear-gradient(135deg, #d7eeff, #b6d8f2);
    --ph-5: linear-gradient(135deg, #ffe6c7, #ffd08a);
    --ph-6: linear-gradient(135deg, #d6f5e3, #a9e5c5);
    --font-display: Fredoka, ui-rounded, "Arial Rounded MT Bold", system-ui, sans-serif;
    --font-body: Mulish, Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    --r-sm: 11px;
    --r: 16px;
    --r-lg: 20px;
    --r-xl: 26px;
    --r-pill: 999px;
    --shadow-card: 0 10px 22px -12px rgba(255, 111, 165, 0.5);
    --shadow-pop: 0 16px 30px -16px rgba(255, 111, 165, 0.6);
    --shadow-btn: 0 12px 22px -10px rgba(255, 92, 153, 0.7);
}

* {
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
}

body {
    margin: 0;
    min-height: 100vh;
    overflow-x: hidden;
    background: var(--bg);
    color: var(--ink);
    font-family: var(--font-body);
    letter-spacing: 0;
    -webkit-font-smoothing: antialiased;
}

button,
input,
select,
textarea {
    font: inherit;
}

button,
a {
    -webkit-tap-highlight-color: transparent;
}

img {
    display: block;
    max-width: 100%;
}

h1,
h2,
h3 {
    margin: 0;
    color: var(--ink);
    font-family: var(--font-display);
    font-weight: 650;
    letter-spacing: 0;
}

::placeholder {
    color: var(--muted-2);
}

/* Login */
.login-page {
    display: grid;
    place-items: center;
    min-height: 100vh;
    background:
        radial-gradient(circle at 12% 18%, rgba(255, 255, 255, 0.32), transparent 26%),
        radial-gradient(circle at 86% 12%, rgba(255, 255, 255, 0.18), transparent 24%),
        var(--grad-rosa);
}

.login-shell {
    width: min(420px, calc(100% - 32px));
}

.login-card {
    display: grid;
    gap: 15px;
    padding: 28px;
    border: 1px solid rgba(255, 255, 255, 0.72);
    border-radius: var(--r-xl);
    background: rgba(255, 251, 252, 0.96);
    box-shadow: 0 34px 70px -32px rgba(120, 40, 80, 0.55);
}

.login-card h1 {
    font-size: 2.15rem;
    line-height: 1.04;
}

.login-card p {
    margin: 0;
    color: var(--muted);
    font-weight: 750;
    line-height: 1.55;
}

.login-card label span,
label span,
.filters span {
    display: block;
    margin-bottom: 7px;
    color: #a8607e;
    font-family: var(--font-display);
    font-size: 0.86rem;
    font-weight: 650;
}

/* Shell */
.app-shell {
    display: flex;
    height: 100vh;
    overflow: hidden;
    background: var(--bg);
}

.topbar {
    width: 248px;
    flex: 0 0 248px;
    display: flex;
    flex-direction: column;
    gap: 18px;
    padding: 24px 16px;
    border-right: 1px solid var(--line);
    background: var(--paper);
}

.brand-lockup {
    display: flex;
    align-items: center;
    gap: 11px;
    padding: 4px 8px 18px;
}

.wardrobe-mark {
    width: 42px;
    height: 42px;
    flex: 0 0 auto;
    display: grid;
    place-items: center;
    border-radius: 14px;
    background: var(--grad-rosa);
    color: #fff;
    box-shadow: var(--shadow-card);
}

.wardrobe-mark svg {
    width: 22px;
    height: 22px;
}

.brand-lockup h1 {
    max-width: 155px;
    overflow: hidden;
    font-size: 1.06rem;
    line-height: 1;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.brand-lockup span {
    display: block;
    margin-top: 2px;
    color: #a8607e;
    font-size: 0.73rem;
    font-weight: 800;
}

.sidebar-nav {
    display: grid;
    gap: 5px;
}

.sidebar-nav a,
.topbar-link,
.status-pill,
.flash,
.button,
.icon-button,
.check-row,
.settings-panel summary,
.note-line,
.phase-ok {
    display: inline-flex;
    align-items: center;
    gap: 9px;
}

.sidebar-nav a {
    min-height: 46px;
    padding: 0 14px;
    border-radius: 14px;
    color: #9b8290;
    font-size: 0.92rem;
    font-weight: 800;
    text-decoration: none;
}

.sidebar-nav a:hover,
.sidebar-nav a:focus-visible {
    background: var(--rosa-100);
    color: var(--rosa-600);
    outline: none;
}

.sidebar-nav svg {
    width: 21px;
    height: 21px;
}

.topbar-actions {
    display: grid;
    gap: 9px;
    margin-top: auto;
}

.topbar-link {
    min-height: 46px;
    justify-content: flex-start;
    border: 0;
    border-radius: 14px;
    background: transparent;
    color: #9b8290;
    font-weight: 800;
    text-decoration: none;
    cursor: pointer;
}

.topbar-link:hover,
.topbar-link:focus-visible {
    background: var(--rosa-100);
    color: var(--rosa-600);
    outline: none;
}

.topbar-link svg,
.status-pill svg {
    width: 19px;
    height: 19px;
}

.logout-form {
    margin: 0;
}

.logout-form .topbar-link {
    width: 100%;
    padding: 0 14px;
}

.sidefoot {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px;
}

.sidefoot > span {
    width: 34px;
    height: 34px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: var(--rosa-100);
    color: #a8607e;
    font-weight: 900;
}

.sidefoot strong,
.sidefoot small {
    display: block;
}

.sidefoot strong {
    font-size: 0.85rem;
}

.sidefoot small {
    color: var(--muted);
    font-size: 0.75rem;
}

.status-pill {
    min-height: 38px;
    justify-content: center;
    padding: 0 13px;
    border-radius: var(--r-pill);
    font-weight: 900;
    white-space: nowrap;
}

.status-pill.is-ready {
    color: var(--ok);
    background: var(--ok-bg);
}

.status-pill.is-waiting {
    color: #a8607e;
    background: var(--rosa-100);
}

.app-main {
    flex: 1 1 auto;
    width: auto;
    min-width: 0;
    height: 100vh;
    overflow-y: auto;
    padding: 32px 40px 48px;
}

.layout {
    margin: 0;
}

.app-main::-webkit-scrollbar {
    width: 8px;
}

.app-main::-webkit-scrollbar-thumb {
    border-radius: 8px;
    background: #ead3df;
}

.app-hero {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 24px;
}

.app-hero h2 {
    font-size: clamp(1.9rem, 3vw, 2.35rem);
    line-height: 1.04;
}

.app-hero p {
    margin: 4px 0 0;
    color: var(--muted);
    font-weight: 750;
}

.eyebrow {
    display: block;
    margin-bottom: 5px;
    color: #a8607e;
    font-size: 0.76rem;
    font-weight: 900;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

/* Feedback */
.flash-stack {
    display: grid;
    gap: 10px;
    margin-bottom: 18px;
}

.flash {
    width: 100%;
    padding: 13px 16px;
    border: 1px solid var(--line);
    border-radius: var(--r);
    background: var(--paper);
    box-shadow: var(--shadow-card);
    font-weight: 750;
}

.flash svg {
    width: 19px;
    height: 19px;
    flex: 0 0 auto;
}

.flash.is-success {
    color: var(--ok);
    background: var(--ok-bg);
}

.flash.is-warning {
    color: var(--warn);
    background: var(--warn-bg);
}

.flash.is-error {
    color: var(--danger);
    background: var(--danger-bg);
}

/* Summary */
.first-run-panel,
.closet-strip,
.mission-panel,
.action-plan-panel,
.quality-panel,
.maternity-panel,
.laundry-panel,
.first-year-panel,
.drawer-panel,
.occasion-panel,
.coverage-panel,
.outfit-panel,
.guardrails-panel,
.budget-panel,
.store-packs-panel,
.phase-panel,
.tool-panel,
.settings-panel,
.empty-state {
    border: 1px solid var(--line);
    border-radius: var(--r-lg);
    background: var(--paper);
    box-shadow: var(--shadow-card);
}

.first-run-panel {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 18px;
    padding: 20px;
}

.first-run-panel h2 {
    font-size: 1.35rem;
}

.first-run-panel p {
    max-width: 680px;
    margin: 7px 0 0;
    color: var(--muted);
    font-weight: 750;
    line-height: 1.5;
}

.first-run-closet {
    min-width: 112px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 12px;
    border-radius: 18px;
    background: var(--rosa-100);
    color: var(--rosa-600);
}

.stats-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 16px;
    margin-bottom: 18px;
}

.metric {
    position: relative;
    min-height: 126px;
    padding: 20px;
    border: 1px solid var(--line);
    border-radius: var(--r-lg);
    background: var(--paper);
}

.metric:last-child {
    border: 0;
    background: var(--grad-rosa);
    color: #fff;
}

.metric:last-child span,
.metric:last-child strong,
.metric:last-child svg {
    color: #fff;
}

.metric > svg {
    position: absolute;
    top: 18px;
    right: 18px;
    width: 22px;
    height: 22px;
    color: var(--rosa-600);
}

.metric span {
    color: var(--muted-2);
    font-size: 0.78rem;
    font-weight: 900;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

.metric strong {
    display: block;
    margin-top: 8px;
    color: var(--ink);
    font-family: var(--font-display);
    font-size: 2.35rem;
    line-height: 1;
}

.mini-progress {
    width: 100%;
    height: 10px;
    margin-top: 16px;
    overflow: hidden;
    border: 0;
    border-radius: 6px;
    background: #f4e6ec;
    appearance: none;
}

.mini-progress::-webkit-progress-bar {
    border-radius: 6px;
    background: #f4e6ec;
}

.mini-progress::-webkit-progress-value {
    border-radius: 6px;
    background: linear-gradient(90deg, #5bd08a, #22a45d);
}

.mini-progress::-moz-progress-bar {
    border-radius: 6px;
    background: linear-gradient(90deg, #5bd08a, #22a45d);
}

.mini-progress.is-rose::-webkit-progress-value,
.missing-item .mini-progress::-webkit-progress-value {
    background: var(--grad-rosa);
}

.mini-progress.is-rose::-moz-progress-bar,
.missing-item .mini-progress::-moz-progress-bar {
    background: var(--grad-rosa);
}

.closet-strip {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    min-height: 82px;
    margin-bottom: 24px;
    padding: 18px 20px;
}

.closet-strip strong {
    display: block;
    font-family: var(--font-display);
    font-size: 1.15rem;
}

.color-story {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 8px;
}

.color-story span,
.chip-row span,
.tag-row span {
    display: inline-flex;
    align-items: center;
    min-height: 30px;
    padding: 0 12px;
    border-radius: var(--r-pill);
    font-size: 0.78rem;
    font-weight: 850;
}

.color-story span,
.chip-row span {
    background: var(--rosa-100);
    color: #a8607e;
}

.tag-row span {
    background: var(--roxo-bg);
    color: var(--roxo-600);
}

/* Mission center */
.mission-panel {
    margin-bottom: 24px;
    padding: 22px;
}

.mission-head p {
    margin: 5px 0 0;
    color: var(--muted);
    font-weight: 800;
    line-height: 1.45;
}

.mission-summary {
    min-width: 132px;
    padding: 14px 16px;
    border-radius: var(--r);
    background: var(--danger-bg);
    color: var(--danger);
    text-align: center;
}

.mission-summary strong,
.mission-summary span {
    display: block;
}

.mission-summary strong {
    font-family: var(--font-display);
    font-size: 1.72rem;
    line-height: 1;
}

.mission-summary span {
    margin-top: 4px;
    font-size: 0.75rem;
    font-weight: 900;
}

.mission-focus {
    display: flex;
    align-items: center;
    gap: 10px;
    min-height: 46px;
    margin-bottom: 14px;
    padding: 0 14px;
    border-radius: var(--r);
    background: var(--rosa-100);
    color: #a8607e;
    font-weight: 900;
}

.mission-focus svg {
    width: 19px;
    height: 19px;
    flex: 0 0 auto;
}

.mission-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
}

.mission-card {
    display: grid;
    grid-template-columns: 44px minmax(0, 1fr);
    gap: 12px;
    min-height: 218px;
    padding: 15px;
    border: 1px solid var(--line);
    border-radius: var(--r);
    background: #fff;
}

.mission-icon {
    width: 44px;
    height: 44px;
    display: grid;
    place-items: center;
    border-radius: 14px;
    background: var(--rosa-100);
    color: var(--rosa-600);
}

.mission-icon svg {
    width: 22px;
    height: 22px;
}

.mission-card-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 8px;
}

.mission-card-head span {
    color: #a8607e;
    font-size: 0.72rem;
    font-weight: 950;
    letter-spacing: 0.04em;
    line-height: 1.15;
    text-transform: uppercase;
}

.mission-card-head strong {
    flex: 0 0 auto;
    min-height: 28px;
    display: inline-flex;
    align-items: center;
    padding: 0 9px;
    border-radius: var(--r-pill);
    background: var(--rosa-100);
    color: #a8607e;
    font-size: 0.72rem;
    font-weight: 950;
}

.mission-card h3 {
    margin-top: 8px;
    font-size: 1.05rem;
    line-height: 1.14;
}

.mission-card p {
    margin: 8px 0 0;
    color: var(--ink-2);
    font-size: 0.88rem;
    font-weight: 780;
    line-height: 1.42;
}

.mission-card .button {
    margin-top: 12px;
}

.mission-card.is-critical .mission-icon,
.mission-card.is-critical .mission-card-head strong {
    background: var(--danger-bg);
    color: var(--danger);
}

.mission-card.is-high .mission-icon,
.mission-card.is-high .mission-card-head strong {
    background: var(--warn-bg);
    color: var(--warn);
}

.mission-card.is-low .mission-icon,
.mission-card.is-low .mission-card-head strong,
.mission-card.is-ready .mission-icon,
.mission-card.is-ready .mission-card-head strong {
    background: var(--ok-bg);
    color: var(--ok);
}

/* Action plan */
.action-plan-panel {
    margin-bottom: 24px;
    padding: 22px;
}

.action-plan-head p {
    margin: 5px 0 0;
    color: var(--muted);
    font-weight: 800;
    line-height: 1.45;
}

.action-plan-summary {
    min-width: 132px;
    padding: 14px 16px;
    border-radius: var(--r);
    background: var(--danger-bg);
    color: var(--danger);
    text-align: center;
}

.action-plan-summary strong,
.action-plan-summary span {
    display: block;
}

.action-plan-summary strong {
    font-family: var(--font-display);
    font-size: 1.72rem;
    line-height: 1;
}

.action-plan-summary span {
    margin-top: 4px;
    font-size: 0.75rem;
    font-weight: 900;
}

.action-plan-next {
    display: flex;
    align-items: center;
    gap: 10px;
    min-height: 46px;
    margin-bottom: 14px;
    padding: 0 14px;
    border-radius: var(--r);
    background: var(--rosa-100);
    color: #a8607e;
    font-weight: 900;
}

.action-plan-next svg {
    width: 19px;
    height: 19px;
    flex: 0 0 auto;
}

.action-plan-toolbar {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 14px;
}

.action-highlights {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 10px;
    margin-bottom: 14px;
}

.action-highlights article {
    min-height: 118px;
    display: grid;
    gap: 6px;
    padding: 14px;
    border: 1px solid var(--line);
    border-radius: var(--r);
    background: var(--rosa-50);
}

.action-highlights svg {
    width: 34px;
    height: 34px;
    padding: 8px;
    border-radius: 13px;
    background: var(--rosa-100);
    color: var(--rosa-600);
}

.action-highlights span {
    color: #a8607e;
    font-size: 0.72rem;
    font-weight: 950;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.action-highlights strong {
    color: var(--ink);
    font-family: var(--font-display);
    font-size: 1.28rem;
    line-height: 1;
}

.action-highlights small {
    color: var(--muted);
    font-size: 0.76rem;
    font-weight: 850;
    line-height: 1.25;
}

.action-lanes {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
}

.action-lane {
    min-height: 420px;
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 15px;
    border: 1px solid var(--line);
    border-radius: var(--r);
    background: #fff;
}

.action-lane-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
}

.action-lane-head span {
    color: #a8607e;
    font-size: 0.72rem;
    font-weight: 950;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.action-lane-head h3 {
    margin-top: 4px;
    font-size: 1.18rem;
    line-height: 1.1;
}

.action-lane-head > svg {
    width: 38px;
    height: 38px;
    padding: 8px;
    border-radius: 13px;
    background: var(--rosa-100);
    color: var(--rosa-600);
}

.action-lane.is-agora .action-lane-head > svg {
    background: var(--danger-bg);
    color: var(--danger);
}

.action-lane.is-manter .action-lane-head > svg {
    background: var(--ok-bg);
    color: var(--ok);
}

.action-lane > p {
    margin: 0;
    min-height: 42px;
    color: var(--ink-2);
    font-size: 0.86rem;
    font-weight: 780;
    line-height: 1.42;
}

.action-task-list {
    display: grid;
    gap: 8px;
    margin-top: 2px;
}

.action-task {
    display: grid;
    grid-template-columns: 34px minmax(0, 1fr) auto;
    align-items: center;
    gap: 9px;
    min-height: 72px;
    padding: 10px;
    border-radius: var(--r);
    background: var(--rosa-50);
    color: var(--ink);
    text-decoration: none;
}

.action-task > svg {
    width: 34px;
    height: 34px;
    padding: 7px;
    border-radius: 12px;
    background: var(--rosa-100);
    color: var(--rosa-600);
}

.action-task.is-critical > svg,
.action-task.is-high > svg {
    background: var(--danger-bg);
    color: var(--danger);
}

.action-task.is-low > svg,
.action-task.is-ready > svg {
    background: var(--ok-bg);
    color: var(--ok);
}

.action-task strong,
.action-task small {
    display: block;
}

.action-task strong {
    font-family: var(--font-display);
    font-size: 0.96rem;
    line-height: 1.08;
}

.action-task small {
    margin-top: 4px;
    color: var(--muted);
    font-size: 0.74rem;
    font-weight: 850;
    line-height: 1.25;
}

.action-task em {
    max-width: 92px;
    padding: 6px 8px;
    border-radius: var(--r-pill);
    background: #fff;
    color: #a8607e;
    font-size: 0.68rem;
    font-style: normal;
    font-weight: 950;
    line-height: 1.1;
    text-align: center;
}

.action-lane-empty {
    min-height: 180px;
    display: grid;
    place-items: center;
    align-content: center;
    gap: 8px;
    margin-top: 2px;
    padding: 18px;
    border-radius: var(--r);
    background: var(--ok-bg);
    color: var(--ok);
    text-align: center;
}

.action-lane-empty svg {
    width: 34px;
    height: 34px;
}

.action-lane-empty strong {
    font-family: var(--font-display);
}

.action-lane-empty span {
    max-width: 250px;
    color: var(--ink-2);
    font-size: 0.8rem;
    font-weight: 850;
    line-height: 1.35;
}

/* Catalog quality */
.quality-panel {
    margin-bottom: 24px;
    padding: 22px;
}

.quality-head p {
    margin: 5px 0 0;
    color: var(--muted);
    font-weight: 800;
    line-height: 1.45;
}

.quality-summary {
    min-width: 132px;
    padding: 14px 16px;
    border-radius: var(--r);
    background: var(--warn-bg);
    color: var(--warn);
    text-align: center;
}

.quality-summary strong,
.quality-summary span {
    display: block;
}

.quality-summary strong {
    font-family: var(--font-display);
    font-size: 1.72rem;
    line-height: 1;
}

.quality-summary span {
    margin-top: 4px;
    font-size: 0.75rem;
    font-weight: 900;
}

.quality-next {
    display: flex;
    align-items: center;
    gap: 10px;
    min-height: 46px;
    margin-bottom: 14px;
    padding: 0 14px;
    border-radius: var(--r);
    background: var(--rosa-100);
    color: #a8607e;
    font-weight: 900;
}

.quality-next svg {
    width: 19px;
    height: 19px;
    flex: 0 0 auto;
}

.quality-metrics {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
    margin-bottom: 12px;
}

.quality-metrics article {
    min-height: 82px;
    padding: 14px;
    border: 1px solid var(--line);
    border-radius: var(--r);
    background: var(--rosa-50);
}

.quality-metrics span {
    display: block;
    color: #a8607e;
    font-size: 0.74rem;
    font-weight: 950;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.quality-metrics strong {
    display: block;
    margin-top: 7px;
    color: var(--ink);
    font-family: var(--font-display);
    font-size: 1.48rem;
    line-height: 1;
}

.quality-actions {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 10px;
    margin-bottom: 14px;
}

.quality-action {
    min-height: 86px;
    display: grid;
    grid-template-columns: 36px minmax(0, 1fr);
    align-items: center;
    gap: 10px;
    padding: 12px;
    border: 1px solid var(--line);
    border-radius: var(--r);
    background: #fff;
    color: var(--ink);
    text-decoration: none;
}

.quality-action svg {
    width: 36px;
    height: 36px;
    padding: 8px;
    border-radius: 13px;
    background: var(--rosa-100);
    color: var(--rosa-600);
}

.quality-action strong,
.quality-action small {
    display: block;
}

.quality-action strong {
    font-family: var(--font-display);
    font-size: 0.98rem;
    line-height: 1.1;
}

.quality-action small {
    margin-top: 4px;
    color: var(--muted);
    font-size: 0.74rem;
    font-weight: 850;
    line-height: 1.25;
}

.quality-action.is-critical svg,
.quality-action.is-high svg {
    background: var(--danger-bg);
    color: var(--danger);
}

.quality-action.is-medium svg {
    background: var(--warn-bg);
    color: var(--warn);
}

.quality-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.7fr) minmax(280px, 0.8fr);
    gap: 12px;
}

.quality-dimension-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
}

.quality-dimension {
    display: grid;
    gap: 10px;
    min-height: 214px;
    padding: 15px;
    border: 1px solid var(--line);
    border-radius: var(--r);
    background: #fff;
}

.quality-dimension-head {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr) auto;
    align-items: start;
    gap: 10px;
}

.quality-dimension-head > svg {
    width: 42px;
    height: 42px;
    padding: 10px;
    border-radius: 14px;
    background: var(--rosa-100);
    color: var(--rosa-600);
}

.quality-dimension-head span {
    display: block;
    color: #a8607e;
    font-size: 0.72rem;
    font-weight: 950;
    letter-spacing: 0.04em;
    line-height: 1.15;
    text-transform: uppercase;
}

.quality-dimension-head h3 {
    margin-top: 4px;
    font-size: 1.02rem;
    line-height: 1.12;
}

.quality-dimension-head strong {
    min-width: 48px;
    min-height: 36px;
    display: grid;
    place-items: center;
    border-radius: 13px;
    background: var(--warn-bg);
    color: var(--warn);
    font-family: var(--font-display);
}

.quality-dimension.is-critical .quality-dimension-head > svg,
.quality-dimension.is-critical .quality-dimension-head strong,
.quality-dimension.is-high .quality-dimension-head > svg,
.quality-dimension.is-high .quality-dimension-head strong {
    background: var(--danger-bg);
    color: var(--danger);
}

.quality-dimension.is-ready .quality-dimension-head > svg,
.quality-dimension.is-ready .quality-dimension-head strong {
    background: var(--ok-bg);
    color: var(--ok);
}

.quality-dimension-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
}

.quality-dimension-meta span {
    display: inline-flex;
    align-items: center;
    min-height: 28px;
    padding: 0 9px;
    border-radius: var(--r-pill);
    background: var(--rosa-100);
    color: #a8607e;
    font-size: 0.73rem;
    font-weight: 950;
}

.quality-dimension .button {
    width: 100%;
    margin-top: auto;
}

.quality-items {
    align-self: start;
    position: sticky;
    top: 18px;
    display: grid;
    gap: 10px;
    padding: 14px;
    border: 1px solid var(--line);
    border-radius: var(--r);
    background: var(--rosa-50);
}

.quality-items-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.quality-items-head strong {
    color: var(--danger);
    font-family: var(--font-display);
    font-size: 1rem;
}

.quality-item {
    display: grid;
    grid-template-columns: 56px minmax(0, 1fr);
    gap: 10px;
    padding: 10px;
    border: 1px solid var(--line);
    border-radius: var(--r);
    background: #fff;
}

.quality-item img {
    width: 56px;
    height: 56px;
    border-radius: 13px;
    object-fit: cover;
    background: var(--rosa-100);
}

.quality-item-title {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 8px;
}

.quality-item-title strong {
    font-family: var(--font-display);
    font-size: 0.98rem;
    line-height: 1.1;
}

.quality-item-title span {
    flex: 0 0 auto;
    min-height: 26px;
    display: inline-flex;
    align-items: center;
    padding: 0 8px;
    border-radius: var(--r-pill);
    background: var(--warn-bg);
    color: var(--warn);
    font-size: 0.72rem;
    font-weight: 950;
}

.quality-item small {
    display: block;
    margin-top: 3px;
    color: var(--muted);
    font-size: 0.74rem;
    font-weight: 850;
}

.quality-issue-row {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 7px;
}

.quality-issue-row span {
    display: inline-flex;
    align-items: center;
    min-height: 24px;
    padding: 0 8px;
    border-radius: var(--r-pill);
    background: var(--warn-bg);
    color: var(--warn);
    font-size: 0.68rem;
    font-weight: 950;
    line-height: 1.1;
}

.quality-issue-row span.is-high {
    background: var(--danger-bg);
    color: var(--danger);
}

.quality-empty {
    display: grid;
    place-items: center;
    min-height: 180px;
    padding: 18px;
    border-radius: var(--r);
    background: #fff;
    text-align: center;
}

.quality-empty svg {
    color: var(--ok);
}

.quality-empty strong,
.quality-empty span {
    display: block;
}

.quality-empty strong {
    margin-top: 8px;
    font-family: var(--font-display);
}

.quality-empty span {
    margin-top: 4px;
    color: var(--muted);
    font-size: 0.82rem;
    font-weight: 850;
}

.quality-method {
    margin: 12px 0 0;
    color: var(--muted);
    font-size: 0.78rem;
    font-weight: 850;
    line-height: 1.4;
}

/* Maternity bag */
.maternity-panel {
    margin-bottom: 24px;
    padding: 22px;
}

.maternity-head p {
    margin: 5px 0 0;
    color: var(--muted);
    font-weight: 800;
    line-height: 1.45;
}

.maternity-summary {
    min-width: 132px;
    padding: 14px 16px;
    border-radius: var(--r);
    background: var(--danger-bg);
    color: var(--danger);
    text-align: center;
}

.maternity-summary strong,
.maternity-summary span {
    display: block;
}

.maternity-summary strong {
    font-family: var(--font-display);
    font-size: 1.72rem;
    line-height: 1;
}

.maternity-summary span {
    margin-top: 4px;
    font-size: 0.75rem;
    font-weight: 900;
}

.maternity-next {
    display: flex;
    align-items: center;
    gap: 10px;
    min-height: 46px;
    margin-bottom: 14px;
    padding: 0 14px;
    border-radius: var(--r);
    background: var(--rosa-100);
    color: #a8607e;
    font-weight: 900;
}

.maternity-next svg {
    width: 19px;
    height: 19px;
    flex: 0 0 auto;
}

.maternity-metrics {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
    margin-bottom: 12px;
}

.maternity-metrics article {
    min-height: 82px;
    padding: 14px;
    border: 1px solid var(--line);
    border-radius: var(--r);
    background: var(--rosa-50);
}

.maternity-metrics span {
    display: block;
    color: #a8607e;
    font-size: 0.74rem;
    font-weight: 950;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.maternity-metrics strong {
    display: block;
    margin-top: 7px;
    color: var(--ink);
    font-family: var(--font-display);
    font-size: 1.58rem;
    line-height: 1;
}

.maternity-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
}

.maternity-kit {
    display: grid;
    gap: 10px;
    min-height: 226px;
    padding: 15px;
    border: 1px solid var(--line);
    border-radius: var(--r);
    background: #fff;
}

.maternity-kit-head {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr) auto;
    align-items: start;
    gap: 10px;
}

.maternity-icon {
    width: 42px;
    height: 42px;
    display: grid;
    place-items: center;
    border-radius: 14px;
    background: var(--rosa-100);
    color: var(--rosa-600);
}

.maternity-icon svg {
    width: 21px;
    height: 21px;
}

.maternity-kit-head span {
    display: block;
    color: #a8607e;
    font-size: 0.72rem;
    font-weight: 950;
    letter-spacing: 0.04em;
    line-height: 1.15;
    text-transform: uppercase;
}

.maternity-kit-head h3 {
    margin-top: 4px;
    font-size: 1.03rem;
    line-height: 1.12;
}

.maternity-kit-head strong {
    min-width: 46px;
    min-height: 36px;
    display: grid;
    place-items: center;
    border-radius: 13px;
    background: var(--danger-bg);
    color: var(--danger);
    font-family: var(--font-display);
}

.maternity-kit.is-partial .maternity-kit-head strong {
    background: var(--warn-bg);
    color: var(--warn);
}

.maternity-kit.is-ready .maternity-kit-head strong {
    background: var(--ok-bg);
    color: var(--ok);
}

.maternity-kit p {
    margin: 0;
    color: var(--ink-2);
    font-size: 0.86rem;
    font-weight: 780;
    line-height: 1.42;
}

.maternity-focus {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 14px;
    padding: 13px;
    border-radius: var(--r);
    background: var(--danger-bg);
    color: var(--danger);
    font-weight: 900;
}

.maternity-focus strong {
    margin-right: 2px;
}

.maternity-focus span {
    display: inline-flex;
    align-items: center;
    min-height: 28px;
    padding: 0 10px;
    border-radius: var(--r-pill);
    background: rgba(255, 255, 255, 0.72);
    font-size: 0.74rem;
}

.maternity-steps {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 10px;
    margin-top: 14px;
}

.maternity-steps article {
    min-height: 106px;
    display: grid;
    grid-template-columns: 34px minmax(0, 1fr);
    gap: 9px;
    padding: 13px;
    border: 1px solid var(--line);
    border-radius: var(--r);
    background: var(--rosa-50);
}

.maternity-steps svg {
    width: 34px;
    height: 34px;
    padding: 7px;
    border-radius: 12px;
    background: var(--rosa-100);
    color: var(--rosa-600);
}

.maternity-steps strong,
.maternity-steps span {
    display: block;
}

.maternity-steps strong {
    color: var(--ink);
    font-family: var(--font-display);
    font-size: 0.96rem;
    line-height: 1.12;
}

.maternity-steps span {
    margin-top: 5px;
    color: var(--ink-2);
    font-size: 0.78rem;
    font-weight: 780;
    line-height: 1.34;
}

.maternity-disclaimer {
    margin: 12px 0 0;
    color: var(--muted);
    font-size: 0.78rem;
    font-weight: 850;
    line-height: 1.4;
}

/* Laundry rotation */
.laundry-panel {
    margin-bottom: 24px;
    padding: 22px;
}

.laundry-head p {
    margin: 5px 0 0;
    color: var(--muted);
    font-weight: 800;
    line-height: 1.45;
}

.laundry-summary {
    min-width: 132px;
    padding: 14px 16px;
    border-radius: var(--r);
    background: var(--rosa-100);
    color: #a8607e;
    text-align: center;
}

.laundry-summary strong,
.laundry-summary span {
    display: block;
}

.laundry-summary strong {
    font-family: var(--font-display);
    font-size: 1.72rem;
    line-height: 1;
}

.laundry-summary span {
    margin-top: 4px;
    font-size: 0.75rem;
    font-weight: 900;
}

.laundry-next {
    display: flex;
    align-items: center;
    gap: 10px;
    min-height: 46px;
    margin-bottom: 14px;
    padding: 0 14px;
    border-radius: var(--r);
    background: var(--rosa-100);
    color: #a8607e;
    font-weight: 900;
}

.laundry-next svg {
    width: 19px;
    height: 19px;
    flex: 0 0 auto;
}

.laundry-metrics {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
    margin-bottom: 12px;
}

.laundry-metrics article {
    min-height: 82px;
    padding: 14px;
    border: 1px solid var(--line);
    border-radius: var(--r);
    background: var(--rosa-50);
}

.laundry-metrics span {
    display: block;
    color: #a8607e;
    font-size: 0.74rem;
    font-weight: 950;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.laundry-metrics strong {
    display: block;
    margin-top: 7px;
    color: var(--ink);
    font-family: var(--font-display);
    font-size: 1.55rem;
    line-height: 1;
}

.laundry-phase-grid {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 10px;
    margin-bottom: 14px;
}

.laundry-phase {
    min-height: 118px;
    display: grid;
    gap: 8px;
    padding: 13px;
    border: 1px solid var(--line);
    border-radius: var(--r);
    background: #fff;
    color: var(--ink);
    cursor: pointer;
    text-align: left;
}

.laundry-phase.is-selected {
    border-color: var(--rosa-300);
    box-shadow: inset 0 0 0 1px var(--rosa-300), var(--shadow-card);
}

.laundry-phase span,
.laundry-phase small {
    color: #a8607e;
    font-size: 0.72rem;
    font-weight: 950;
    letter-spacing: 0.04em;
    line-height: 1.15;
    text-transform: uppercase;
}

.laundry-phase strong {
    color: var(--rosa-600);
    font-family: var(--font-display);
    font-size: 1.65rem;
    line-height: 1;
}

.laundry-phase.is-critical strong {
    color: var(--danger);
}

.laundry-phase.is-high strong {
    color: var(--warn);
}

.laundry-phase.is-ready strong {
    color: var(--ok);
}

.laundry-layout {
    display: grid;
    grid-template-columns: minmax(230px, 0.8fr) minmax(0, 2fr);
    gap: 12px;
}

.laundry-focus-card {
    align-self: start;
    position: sticky;
    top: 18px;
    display: grid;
    gap: 12px;
    padding: 16px;
    border: 1px solid var(--line);
    border-radius: var(--r);
    background: var(--rosa-50);
}

.laundry-focus-card h3 {
    font-size: 1.45rem;
    line-height: 1;
}

.laundry-focus-card > strong {
    color: var(--rosa-600);
    font-family: var(--font-display);
    font-size: 2rem;
    line-height: 1;
}

.laundry-focus-card.is-critical > strong {
    color: var(--danger);
}

.laundry-focus-card.is-high > strong {
    color: var(--warn);
}

.laundry-focus-card.is-ready > strong {
    color: var(--ok);
}

.laundry-focus-card p {
    margin: 0;
    color: var(--ink-2);
    font-size: 0.9rem;
    font-weight: 780;
    line-height: 1.44;
}

.laundry-gap-callout {
    display: grid;
    grid-template-columns: 32px minmax(0, 1fr);
    align-items: center;
    gap: 8px;
    min-height: 48px;
    padding: 10px;
    border-radius: var(--r);
    background: var(--danger-bg);
    color: var(--danger);
    font-weight: 900;
}

.laundry-gap-callout.is-ready {
    background: var(--ok-bg);
    color: var(--ok);
}

.laundry-gap-callout svg {
    width: 32px;
    height: 32px;
    padding: 7px;
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.66);
}

.laundry-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.laundry-row-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.laundry-row {
    display: grid;
    gap: 10px;
    min-height: 220px;
    padding: 15px;
    border: 1px solid var(--line);
    border-radius: var(--r);
    background: #fff;
}

.laundry-row-head {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr) auto;
    align-items: start;
    gap: 10px;
}

.laundry-icon {
    width: 42px;
    height: 42px;
    display: grid;
    place-items: center;
    border-radius: 14px;
    background: var(--rosa-100);
    color: var(--rosa-600);
}

.laundry-icon svg {
    width: 21px;
    height: 21px;
}

.laundry-row-head span {
    display: block;
    color: #a8607e;
    font-size: 0.72rem;
    font-weight: 950;
    letter-spacing: 0.04em;
    line-height: 1.15;
    text-transform: uppercase;
}

.laundry-row-head h3 {
    margin-top: 4px;
    font-size: 1.03rem;
    line-height: 1.12;
}

.laundry-row-head strong {
    min-width: 46px;
    min-height: 36px;
    display: grid;
    place-items: center;
    border-radius: 13px;
    background: var(--danger-bg);
    color: var(--danger);
    font-family: var(--font-display);
}

.laundry-row.is-low .laundry-row-head strong {
    background: var(--warn-bg);
    color: var(--warn);
}

.laundry-row.is-ready .laundry-row-head strong {
    background: var(--ok-bg);
    color: var(--ok);
}

.laundry-row-days {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.laundry-row-days span,
.laundry-row-days small {
    display: inline-flex;
    align-items: center;
    min-height: 28px;
    padding: 0 9px;
    border-radius: var(--r-pill);
    background: var(--rosa-100);
    color: #a8607e;
    font-size: 0.73rem;
    font-weight: 950;
}

.laundry-row p {
    margin: 0;
    color: var(--ink-2);
    font-size: 0.86rem;
    font-weight: 780;
    line-height: 1.42;
}

.laundry-gaps,
.laundry-guidance {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 14px;
}

.laundry-gaps span,
.laundry-guidance span {
    display: inline-flex;
    align-items: center;
    min-height: 32px;
    padding: 0 12px;
    border-radius: var(--r-pill);
    font-size: 0.76rem;
    font-weight: 900;
}

.laundry-gaps span {
    background: var(--danger-bg);
    color: var(--danger);
}

.laundry-guidance span {
    background: var(--rosa-100);
    color: #a8607e;
}

.laundry-disclaimer {
    margin: 12px 0 0;
    color: var(--muted);
    font-size: 0.78rem;
    font-weight: 850;
    line-height: 1.4;
}

/* First year timeline */
.first-year-panel {
    margin-bottom: 24px;
    padding: 22px;
}

.first-year-head p {
    margin: 5px 0 0;
    color: var(--muted);
    font-weight: 800;
    line-height: 1.45;
}

.first-year-summary {
    min-width: 132px;
    padding: 14px 16px;
    border-radius: var(--r);
    background: var(--roxo-bg);
    color: var(--roxo-600);
    text-align: center;
}

.first-year-summary strong,
.first-year-summary span {
    display: block;
}

.first-year-summary strong {
    font-family: var(--font-display);
    font-size: 1.72rem;
    line-height: 1;
}

.first-year-summary span {
    margin-top: 4px;
    font-size: 0.75rem;
    font-weight: 900;
}

.first-year-next {
    display: flex;
    align-items: center;
    gap: 10px;
    min-height: 46px;
    margin-bottom: 14px;
    padding: 0 14px;
    border-radius: var(--r);
    background: var(--rosa-100);
    color: #a8607e;
    font-weight: 900;
}

.first-year-next svg {
    width: 19px;
    height: 19px;
    flex: 0 0 auto;
}

.year-rail {
    display: grid;
    grid-template-columns: repeat(6, minmax(190px, 1fr));
    gap: 12px;
    overflow-x: auto;
    padding-bottom: 4px;
    scrollbar-width: thin;
}

.year-phase {
    min-height: 286px;
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 15px;
    border: 1px solid var(--line);
    border-radius: var(--r);
    background: #fff;
}

.year-phase-top,
.year-phase-score,
.year-phase-meta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.year-phase-top span,
.year-phase-meta span {
    color: #a8607e;
    font-size: 0.72rem;
    font-weight: 950;
    letter-spacing: 0.04em;
    line-height: 1.15;
    text-transform: uppercase;
}

.year-phase-top strong {
    color: var(--ink);
    font-family: var(--font-display);
    font-size: 1.22rem;
    line-height: 1;
}

.year-phase-score {
    align-items: flex-end;
}

.year-phase-score span {
    color: var(--muted);
    font-weight: 900;
}

.year-phase-score strong {
    color: var(--rosa-600);
    font-family: var(--font-display);
    font-size: 1.75rem;
    line-height: 1;
}

.year-phase-meta span {
    min-height: 28px;
    display: inline-flex;
    align-items: center;
    padding: 0 9px;
    border-radius: var(--r-pill);
    background: var(--rosa-100);
}

.year-phase p {
    min-height: 58px;
    margin: 0;
    color: var(--ink-2);
    font-size: 0.86rem;
    font-weight: 780;
    line-height: 1.42;
}

.year-gaps {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
}

.year-gaps small {
    display: inline-flex;
    align-items: center;
    min-height: 27px;
    padding: 0 9px;
    border-radius: var(--r-pill);
    background: var(--danger-bg);
    color: var(--danger);
    font-size: 0.7rem;
    font-weight: 950;
    line-height: 1.1;
}

.year-gaps.is-ready small {
    background: var(--ok-bg);
    color: var(--ok);
}

.year-phase .button {
    width: 100%;
    margin-top: auto;
}

.year-phase.is-critical .year-phase-score strong,
.year-phase.is-critical .year-gaps small {
    color: var(--danger);
}

.year-phase.is-high .year-phase-score strong,
.year-phase.is-high .year-gaps small {
    color: var(--warn);
}

.year-phase.is-high .year-gaps small {
    background: var(--warn-bg);
}

.year-phase.is-ready .year-phase-score strong {
    color: var(--ok);
}

.milestone-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
    margin-top: 14px;
}

.milestone-card {
    min-height: 104px;
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr);
    gap: 10px;
    padding: 14px;
    border: 1px solid var(--line);
    border-radius: var(--r);
    background: var(--rosa-50);
}

.milestone-card svg {
    width: 38px;
    height: 38px;
    padding: 8px;
    border-radius: 13px;
    background: var(--rosa-100);
    color: var(--rosa-600);
}

.milestone-card strong {
    display: block;
    color: var(--ink);
    font-family: var(--font-display);
    font-size: 1rem;
    line-height: 1.1;
}

.milestone-card span {
    display: block;
    margin-top: 5px;
    color: var(--ink-2);
    font-size: 0.8rem;
    font-weight: 780;
    line-height: 1.35;
}

/* Drawer transition */
.drawer-panel {
    margin-bottom: 24px;
    padding: 22px;
}

.drawer-head p {
    margin: 5px 0 0;
    color: var(--muted);
    font-weight: 800;
    line-height: 1.45;
}

.drawer-summary {
    min-width: 132px;
    padding: 14px 16px;
    border-radius: var(--r);
    background: var(--rosa-100);
    color: #a8607e;
    text-align: center;
}

.drawer-summary strong,
.drawer-summary span {
    display: block;
}

.drawer-summary strong {
    font-family: var(--font-display);
    font-size: 1.72rem;
    line-height: 1;
}

.drawer-summary span {
    margin-top: 4px;
    font-size: 0.75rem;
    font-weight: 900;
}

.drawer-next {
    display: flex;
    align-items: center;
    gap: 10px;
    min-height: 46px;
    margin-bottom: 14px;
    padding: 0 14px;
    border-radius: var(--r);
    background: var(--roxo-bg);
    color: #6a5a86;
    font-weight: 900;
}

.drawer-next svg {
    width: 19px;
    height: 19px;
    flex: 0 0 auto;
}

.drawer-metrics {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
    margin-bottom: 14px;
}

.drawer-metrics article {
    min-height: 82px;
    padding: 14px;
    border: 1px solid var(--line);
    border-radius: var(--r);
    background: var(--rosa-50);
}

.drawer-metrics span {
    display: block;
    color: #a8607e;
    font-size: 0.74rem;
    font-weight: 950;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.drawer-metrics strong {
    display: block;
    margin-top: 7px;
    color: var(--ink);
    font-family: var(--font-display);
    font-size: 1.35rem;
    line-height: 1.05;
}

.drawer-layout {
    display: grid;
    grid-template-columns: minmax(240px, 0.42fr) minmax(0, 1fr);
    gap: 14px;
    align-items: start;
}

.drawer-focus,
.drawer-transition,
.drawer-rack-item {
    border: 1px solid var(--line);
    border-radius: var(--r);
    background: #fff;
}

.drawer-focus {
    position: sticky;
    top: 18px;
    display: grid;
    gap: 10px;
    padding: 16px;
}

.drawer-focus h3 {
    font-size: 1.38rem;
    line-height: 1.1;
}

.drawer-focus > strong {
    color: var(--rosa-600);
    font-family: var(--font-display);
    font-size: 2rem;
    line-height: 1;
}

.drawer-focus p {
    margin: 0;
    color: var(--ink-2);
    font-weight: 820;
    line-height: 1.42;
}

.drawer-focus-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.drawer-transition-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.drawer-transition {
    min-width: 0;
    display: grid;
    gap: 10px;
    min-height: 292px;
    padding: 15px;
}

.drawer-transition-head,
.drawer-transition-meta {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
}

.drawer-transition-head > div {
    min-width: 0;
}

.drawer-transition-head span {
    display: block;
    color: #a8607e;
    font-size: 0.72rem;
    font-weight: 950;
    letter-spacing: 0.04em;
    line-height: 1.15;
    text-transform: uppercase;
}

.drawer-transition-head h3 {
    margin-top: 5px;
    font-size: 1.08rem;
    line-height: 1.14;
}

.drawer-transition-head strong {
    flex: 0 0 auto;
    color: var(--rosa-600);
    font-family: var(--font-display);
    font-size: 1.35rem;
    line-height: 1;
}

.drawer-transition.is-critical .drawer-transition-head strong,
.drawer-focus.is-critical > strong {
    color: var(--danger);
}

.drawer-transition.is-high .drawer-transition-head strong,
.drawer-focus.is-high > strong {
    color: var(--warn);
}

.drawer-transition.is-ready .drawer-transition-head strong,
.drawer-focus.is-ready > strong {
    color: var(--ok);
}

.drawer-transition-meta span {
    display: inline-flex;
    align-items: center;
    min-height: 28px;
    padding: 0 9px;
    border-radius: var(--r-pill);
    background: var(--rosa-100);
    color: #a8607e;
    font-size: 0.72rem;
    font-weight: 950;
}

.drawer-checklist {
    display: grid;
    gap: 7px;
}

.drawer-checklist span {
    min-width: 0;
    display: grid;
    grid-template-columns: 28px minmax(0, 1fr);
    align-items: center;
    gap: 8px;
    min-height: 34px;
    color: var(--ink-2);
    font-size: 0.8rem;
    font-weight: 850;
    line-height: 1.28;
}

.drawer-checklist svg {
    width: 28px;
    height: 28px;
    padding: 6px;
    border-radius: 10px;
    background: var(--rosa-100);
    color: var(--rosa-600);
}

.drawer-buy-chips,
.drawer-pause-chips,
.drawer-rules {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
}

.drawer-buy-chips small,
.drawer-pause-chips small,
.drawer-rules span {
    display: inline-flex;
    align-items: center;
    min-height: 29px;
    padding: 0 10px;
    border-radius: var(--r-pill);
    font-size: 0.72rem;
    font-weight: 900;
    line-height: 1.15;
}

.drawer-buy-chips small {
    background: var(--danger-bg);
    color: var(--danger);
}

.drawer-pause-chips small {
    background: var(--roxo-bg);
    color: #6a5a86;
}

.drawer-rack {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 9px;
    margin-top: 14px;
}

.drawer-rack-item {
    min-height: 92px;
    display: grid;
    gap: 4px;
    align-content: center;
    padding: 12px;
    background: var(--rosa-50);
}

.drawer-rack-item span {
    color: #a8607e;
    font-size: 0.72rem;
    font-weight: 950;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.drawer-rack-item strong {
    color: var(--ink);
    font-family: var(--font-display);
    font-size: 1.08rem;
}

.drawer-rack-item small {
    color: var(--muted);
    font-size: 0.75rem;
    font-weight: 850;
}

.drawer-rules {
    margin-top: 14px;
}

.drawer-rules span {
    gap: 7px;
    background: var(--roxo-bg);
    color: #6a5a86;
}

.drawer-rules svg {
    width: 16px;
    height: 16px;
    flex: 0 0 auto;
}

.drawer-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
    margin-top: 14px;
}

/* Occasion readiness */
.occasion-panel {
    margin-bottom: 24px;
    padding: 22px;
}

.occasion-head p {
    margin: 5px 0 0;
    color: var(--muted);
    font-weight: 800;
    line-height: 1.45;
}

.occasion-summary {
    min-width: 132px;
    padding: 14px 16px;
    border-radius: var(--r);
    background: var(--rosa-100);
    color: #a8607e;
    text-align: center;
}

.occasion-summary strong,
.occasion-summary span {
    display: block;
}

.occasion-summary strong {
    font-family: var(--font-display);
    font-size: 1.72rem;
    line-height: 1;
}

.occasion-summary span {
    margin-top: 4px;
    font-size: 0.75rem;
    font-weight: 900;
}

.occasion-next {
    display: flex;
    align-items: center;
    gap: 10px;
    min-height: 46px;
    margin-bottom: 14px;
    padding: 0 14px;
    border-radius: var(--r);
    background: var(--roxo-bg);
    color: #6a5a86;
    font-weight: 900;
}

.occasion-next svg {
    width: 19px;
    height: 19px;
    flex: 0 0 auto;
}

.occasion-metrics {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
    margin-bottom: 14px;
}

.occasion-metrics article {
    min-height: 82px;
    padding: 14px;
    border: 1px solid var(--line);
    border-radius: var(--r);
    background: var(--rosa-50);
}

.occasion-metrics span {
    display: block;
    color: #a8607e;
    font-size: 0.74rem;
    font-weight: 950;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.occasion-metrics strong {
    display: block;
    margin-top: 7px;
    color: var(--ink);
    font-family: var(--font-display);
    font-size: 1.35rem;
    line-height: 1.05;
}

.occasion-layout {
    display: grid;
    grid-template-columns: minmax(250px, 0.4fr) minmax(0, 1fr);
    gap: 14px;
    align-items: start;
}

.occasion-focus,
.occasion-card {
    min-width: 0;
    border: 1px solid var(--line);
    border-radius: var(--r);
    background: #fff;
}

.occasion-focus {
    position: sticky;
    top: 18px;
    display: grid;
    gap: 10px;
    padding: 16px;
}

.occasion-focus > svg {
    width: 38px;
    height: 38px;
    padding: 9px;
    border-radius: 14px;
    background: var(--rosa-100);
    color: var(--rosa-600);
}

.occasion-focus h3 {
    font-size: 1.34rem;
    line-height: 1.12;
}

.occasion-focus > strong {
    color: var(--rosa-600);
    font-family: var(--font-display);
    font-size: 2rem;
    line-height: 1;
}

.occasion-focus p {
    margin: 0;
    color: var(--ink-2);
    font-weight: 820;
    line-height: 1.42;
}

.occasion-focus-status {
    display: inline-flex;
    align-items: center;
    width: fit-content;
    min-height: 29px;
    padding: 0 10px;
    border-radius: var(--r-pill);
    background: var(--rosa-100);
    color: #a8607e;
    font-size: 0.76rem;
    font-weight: 950;
}

.occasion-focus-gaps,
.occasion-gap-list,
.occasion-top-gaps,
.occasion-rules {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
}

.occasion-focus-gaps small,
.occasion-gap-list small,
.occasion-top-gaps span,
.occasion-rules span {
    display: inline-flex;
    align-items: center;
    min-height: 29px;
    padding: 0 10px;
    border-radius: var(--r-pill);
    font-size: 0.72rem;
    font-weight: 900;
    line-height: 1.15;
}

.occasion-focus-gaps small,
.occasion-gap-list small,
.occasion-top-gaps span {
    background: var(--danger-bg);
    color: var(--danger);
}

.occasion-focus-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.occasion-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.occasion-card {
    display: grid;
    gap: 10px;
    min-height: 278px;
    padding: 15px;
}

.occasion-card-head {
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr) auto;
    align-items: start;
    gap: 10px;
}

.occasion-card-head > svg {
    width: 38px;
    height: 38px;
    padding: 9px;
    border-radius: 14px;
    background: var(--rosa-100);
    color: var(--rosa-600);
}

.occasion-card-head h3 {
    font-size: 1.08rem;
    line-height: 1.12;
}

.occasion-card-head span {
    display: block;
    margin-top: 4px;
    color: #a8607e;
    font-size: 0.72rem;
    font-weight: 950;
    text-transform: uppercase;
}

.occasion-card-head strong {
    color: var(--rosa-600);
    font-family: var(--font-display);
    font-size: 1.35rem;
    line-height: 1;
}

.occasion-card.is-critical .occasion-card-head strong,
.occasion-focus.is-critical > strong {
    color: var(--danger);
}

.occasion-card.is-high .occasion-card-head strong,
.occasion-focus.is-high > strong {
    color: var(--warn);
}

.occasion-card.is-ready .occasion-card-head strong,
.occasion-focus.is-ready > strong {
    color: var(--ok);
}

.occasion-card p {
    margin: 0;
    color: var(--ink-2);
    font-size: 0.82rem;
    font-weight: 820;
    line-height: 1.34;
}

.occasion-size-list {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.occasion-size-list span {
    min-height: 28px;
    padding: 0 9px;
    border-radius: var(--r-pill);
    background: var(--rosa-100);
    color: #a8607e;
    font-size: 0.7rem;
    font-weight: 950;
    line-height: 28px;
}

.occasion-size-list span.is-critical {
    background: var(--danger-bg);
    color: var(--danger);
}

.occasion-size-list span.is-high {
    background: var(--warn-bg);
    color: var(--warn);
}

.occasion-size-list span.is-ready {
    background: var(--ok-bg);
    color: var(--ok);
}

.occasion-top-gaps,
.occasion-rules,
.occasion-actions {
    margin-top: 14px;
}

.occasion-rules span {
    gap: 7px;
    background: var(--roxo-bg);
    color: #6a5a86;
}

.occasion-rules svg {
    width: 16px;
    height: 16px;
    flex: 0 0 auto;
}

.occasion-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
}

/* Coverage matrix */
.coverage-panel {
    margin-bottom: 24px;
    padding: 22px;
}

.coverage-head p {
    margin: 5px 0 0;
    color: var(--muted);
    font-weight: 800;
    line-height: 1.45;
}

.coverage-summary {
    min-width: 132px;
    padding: 14px 16px;
    border-radius: var(--r);
    background: var(--rosa-100);
    color: #a8607e;
    text-align: center;
}

.coverage-summary strong,
.coverage-summary span {
    display: block;
}

.coverage-summary strong {
    font-family: var(--font-display);
    font-size: 1.72rem;
    line-height: 1;
}

.coverage-summary span {
    margin-top: 4px;
    font-size: 0.75rem;
    font-weight: 900;
}

.coverage-metrics {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
    margin-bottom: 12px;
}

.coverage-metrics article {
    min-height: 82px;
    padding: 14px;
    border: 1px solid var(--line);
    border-radius: var(--r);
    background: var(--rosa-50);
}

.coverage-metrics span {
    display: block;
    color: #a8607e;
    font-size: 0.74rem;
    font-weight: 950;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.coverage-metrics strong {
    display: block;
    margin-top: 7px;
    color: var(--ink);
    font-family: var(--font-display);
    font-size: 1.65rem;
    line-height: 1;
}

.coverage-priorities {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 14px;
}

.coverage-priorities span {
    display: inline-flex;
    align-items: center;
    min-height: 32px;
    padding: 0 12px;
    border-radius: var(--r-pill);
    background: var(--danger-bg);
    color: var(--danger);
    font-size: 0.76rem;
    font-weight: 900;
}

.matrix-scroll {
    overflow-x: auto;
    border: 1px solid var(--line);
    border-radius: var(--r);
    background: #fff;
}

.coverage-table {
    width: 100%;
    min-width: 930px;
    border-collapse: separate;
    border-spacing: 0;
}

.coverage-table th,
.coverage-table td {
    border-bottom: 1px solid var(--line);
    border-right: 1px solid var(--line);
    padding: 8px;
    vertical-align: middle;
}

.coverage-table tr:last-child th,
.coverage-table tr:last-child td {
    border-bottom: 0;
}

.coverage-table th:last-child,
.coverage-table td:last-child {
    border-right: 0;
}

.coverage-table thead th {
    position: sticky;
    top: 0;
    z-index: 2;
    background: var(--rosa-50);
    color: #a8607e;
    font-size: 0.75rem;
    font-weight: 950;
    letter-spacing: 0.04em;
    text-align: center;
    text-transform: uppercase;
}

.coverage-table th:first-child {
    position: sticky;
    left: 0;
    z-index: 3;
    min-width: 168px;
    background: #fff;
    color: var(--ink);
    font-family: var(--font-display);
    font-size: 0.92rem;
    line-height: 1.15;
    text-align: left;
}

.coverage-table thead th:first-child {
    background: var(--rosa-50);
    color: #a8607e;
}

.matrix-cell {
    display: grid;
    place-items: center;
    gap: 4px;
    min-height: 62px;
    padding: 8px;
    border-radius: 13px;
    background: var(--ok-bg);
    color: var(--ok);
    text-align: center;
}

.matrix-cell strong {
    font-family: var(--font-display);
    font-size: 1.02rem;
    line-height: 1;
}

.matrix-cell span {
    font-size: 0.68rem;
    font-weight: 950;
    line-height: 1.1;
    text-transform: uppercase;
}

.matrix-cell.is-empty {
    background: var(--danger-bg);
    color: var(--danger);
}

.matrix-cell.is-low {
    background: var(--warn-bg);
    color: var(--warn);
}

.matrix-cell.is-partial {
    background: var(--rosa-100);
    color: #a8607e;
}

.matrix-cell.is-overstock {
    background: var(--roxo-bg);
    color: var(--roxo-600);
}

/* Outfit planner */
.outfit-panel {
    margin-bottom: 24px;
    padding: 22px;
}

.outfit-head p {
    margin: 5px 0 0;
    color: var(--muted);
    font-weight: 800;
    line-height: 1.45;
}

.outfit-summary {
    min-width: 132px;
    padding: 14px 16px;
    border-radius: var(--r);
    background: var(--roxo-bg);
    color: var(--roxo-600);
    text-align: center;
}

.outfit-summary strong,
.outfit-summary span {
    display: block;
}

.outfit-summary strong {
    font-family: var(--font-display);
    font-size: 1.72rem;
    line-height: 1;
}

.outfit-summary span {
    margin-top: 4px;
    font-size: 0.75rem;
    font-weight: 900;
}

.outfit-tabs {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 8px;
    margin-bottom: 12px;
}

.outfit-tabs button {
    min-height: 56px;
    display: grid;
    gap: 3px;
    border: 0;
    border-radius: var(--r);
    background: var(--rosa-100);
    color: #a8607e;
    cursor: pointer;
    font-weight: 950;
}

.outfit-tabs button.is-selected {
    background: var(--grad-rosa);
    color: #fff;
    box-shadow: var(--shadow-btn);
}

.outfit-tabs span,
.outfit-tabs strong {
    line-height: 1;
}

.outfit-tabs strong {
    font-family: var(--font-display);
    font-size: 1.05rem;
}

.outfit-gaps {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 14px;
}

.outfit-gaps span {
    display: inline-flex;
    align-items: center;
    min-height: 32px;
    padding: 0 12px;
    border-radius: var(--r-pill);
    background: var(--warn-bg);
    color: var(--warn);
    font-size: 0.76rem;
    font-weight: 900;
}

.outfit-layout {
    display: grid;
    grid-template-columns: minmax(220px, 0.6fr) minmax(0, 1.4fr);
    gap: 14px;
    align-items: start;
}

.outfit-phase-card,
.outfit-capsule {
    border: 1px solid var(--line);
    border-radius: var(--r);
    background: #fff;
}

.outfit-phase-card {
    position: sticky;
    top: 18px;
    display: grid;
    gap: 10px;
    padding: 17px;
}

.outfit-phase-card h3 {
    font-size: 1.45rem;
    line-height: 1;
}

.outfit-phase-card > strong {
    color: var(--rosa-600);
    font-family: var(--font-display);
    font-size: 2rem;
    line-height: 1;
}

.outfit-phase-card p,
.outfit-capsule p {
    margin: 0;
    color: var(--ink-2);
    font-weight: 780;
    line-height: 1.42;
}

.outfit-palette,
.outfit-parts {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
}

.outfit-palette span,
.outfit-parts small {
    display: inline-flex;
    align-items: center;
    min-height: 28px;
    padding: 0 10px;
    border-radius: var(--r-pill);
    font-size: 0.72rem;
    font-weight: 900;
    line-height: 1.15;
}

.outfit-palette span {
    background: var(--rosa-100);
    color: #a8607e;
}

.outfit-capsule-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.outfit-capsule {
    display: grid;
    gap: 10px;
    min-height: 222px;
    padding: 15px;
}

.outfit-capsule-head {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr) auto;
    align-items: start;
    gap: 10px;
}

.outfit-icon {
    width: 42px;
    height: 42px;
    display: grid;
    place-items: center;
    border-radius: 14px;
    background: var(--rosa-100);
    color: var(--rosa-600);
}

.outfit-icon svg {
    width: 21px;
    height: 21px;
}

.outfit-capsule-head span {
    display: block;
    color: #a8607e;
    font-size: 0.72rem;
    font-weight: 950;
    letter-spacing: 0.04em;
    line-height: 1.15;
    text-transform: uppercase;
}

.outfit-capsule-head h3 {
    margin-top: 4px;
    font-size: 1.04rem;
    line-height: 1.12;
}

.outfit-capsule-head strong {
    min-width: 48px;
    min-height: 38px;
    display: grid;
    place-items: center;
    border-radius: 13px;
    background: var(--ok-bg);
    color: var(--ok);
    font-family: var(--font-display);
}

.outfit-capsule.is-blocked .outfit-capsule-head strong {
    background: var(--danger-bg);
    color: var(--danger);
}

.outfit-capsule.is-partial .outfit-capsule-head strong,
.outfit-capsule.is-almost .outfit-capsule-head strong {
    background: var(--warn-bg);
    color: var(--warn);
}

.outfit-parts small {
    background: var(--ok-bg);
    color: var(--ok);
}

.outfit-parts small.is-empty {
    background: var(--danger-bg);
    color: var(--danger);
}

.outfit-parts small.is-partial {
    background: var(--rosa-100);
    color: #a8607e;
}

/* Radar */
.radar-panel {
    margin-bottom: 24px;
    padding: 22px;
    border: 1px solid var(--line);
    border-radius: var(--r-lg);
    background:
        linear-gradient(180deg, rgba(255, 246, 250, 0.96), rgba(255, 255, 255, 0.98)),
        var(--paper);
    box-shadow: var(--shadow-card);
}

.radar-method {
    max-width: 360px;
    color: var(--muted);
    font-size: 0.82rem;
    font-weight: 850;
    line-height: 1.35;
    text-align: right;
}

.radar-grid {
    display: grid;
    grid-template-columns: minmax(280px, 1.1fr) minmax(320px, 1.35fr);
    gap: 16px;
}

.radar-score-card,
.radar-card,
.tip-card,
.phase-risk {
    border: 1px solid var(--line);
    border-radius: var(--r);
    background: #fff;
}

.radar-score-card {
    display: grid;
    grid-template-columns: 128px 1fr;
    align-items: center;
    gap: 18px;
    min-height: 184px;
    padding: 18px;
}

.score-ring {
    width: 126px;
    height: 126px;
    display: grid;
    place-items: center;
    align-content: center;
    border-radius: 50%;
    background:
        radial-gradient(circle at center, #fff 0 57%, transparent 58%),
        conic-gradient(#ff6fa5 var(--score), #f6dfeb 0);
    box-shadow: inset 0 0 0 1px #f5d9e5;
}

.score-ring strong,
.score-ring span {
    display: block;
    text-align: center;
}

.score-ring strong {
    color: var(--rosa-600);
    font-family: var(--font-display);
    font-size: 2rem;
    line-height: 1;
}

.score-ring span {
    max-width: 82px;
    color: var(--muted);
    font-size: 0.72rem;
    font-weight: 900;
    line-height: 1.1;
}

.radar-score-card h3,
.tip-card h3 {
    font-size: 1.18rem;
}

.radar-score-card p,
.weak-phase p,
.tip-card p {
    margin: 8px 0 0;
    color: var(--ink-2);
    font-weight: 750;
    line-height: 1.45;
}

.health-row {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 12px;
}

.health-row span,
.priority-item span,
.pause-list span,
.tip-card > div > span {
    display: inline-flex;
    align-items: center;
    min-height: 28px;
    padding: 0 10px;
    border-radius: var(--r-pill);
    font-size: 0.72rem;
    font-weight: 900;
}

.health-row span {
    background: var(--rosa-100);
    color: #a8607e;
}

.radar-card {
    min-height: 184px;
    padding: 16px;
}

.radar-actions {
    grid-row: span 2;
}

.radar-card-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 12px;
    color: #a8607e;
    font-family: var(--font-display);
    font-weight: 700;
}

.radar-card-head svg {
    width: 22px;
    height: 22px;
    color: var(--rosa-600);
}

.priority-list,
.pause-list {
    display: grid;
    gap: 10px;
}

.priority-item {
    position: relative;
    display: grid;
    gap: 4px;
    padding: 13px 74px 13px 14px;
    border: 1px solid var(--line);
    border-radius: 14px;
    background: var(--rosa-50);
}

.priority-item strong {
    color: var(--ink);
    font-family: var(--font-display);
    font-size: 0.98rem;
    line-height: 1.2;
}

.priority-item small,
.weak-phase small,
.tip-card small,
.phase-risk small {
    color: var(--muted);
    font-weight: 850;
    line-height: 1.35;
}

.priority-item span {
    position: absolute;
    top: 12px;
    right: 12px;
    background: var(--warn-bg);
    color: var(--warn);
}

.priority-item.is-critical span,
.priority-item.is-high span {
    background: var(--danger-bg);
    color: var(--danger);
}

.priority-item.is-medium span {
    background: var(--warn-bg);
    color: var(--warn);
}

.weak-phase strong {
    color: var(--danger);
    font-family: var(--font-display);
    font-size: 1.35rem;
}

.pause-list span {
    justify-content: flex-start;
    min-height: 34px;
    background: var(--roxo-bg);
    color: #6a5a86;
}

.phase-radar-row {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 10px;
    margin-top: 16px;
}

.phase-risk {
    min-height: 118px;
    padding: 13px;
}

.phase-risk > span,
.phase-risk strong,
.phase-risk small {
    display: block;
}

.phase-risk > span {
    color: #a8607e;
    font-family: var(--font-display);
    font-weight: 700;
}

.phase-risk strong {
    margin-top: 8px;
    color: var(--danger);
    font-family: var(--font-display);
    font-size: 1.5rem;
    line-height: 1;
}

.phase-risk.is-medium strong {
    color: var(--warn);
}

.phase-risk.is-ready strong {
    color: var(--ok);
}

.phase-risk .mini-progress {
    margin-top: 10px;
}

.tips-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    margin-top: 16px;
}

.tip-card {
    display: grid;
    grid-template-columns: 42px 1fr;
    gap: 12px;
    min-height: 168px;
    padding: 15px;
}

.tip-icon {
    width: 42px;
    height: 42px;
    display: grid;
    place-items: center;
    border-radius: 14px;
    background: var(--rosa-100);
    color: var(--rosa-600);
}

.tip-icon svg {
    width: 22px;
    height: 22px;
}

.tip-card > div > span {
    margin-bottom: 7px;
    background: var(--rosa-100);
    color: #a8607e;
}

.tip-card p {
    font-size: 0.9rem;
}

.tip-card small {
    display: block;
    margin-top: 10px;
    color: #6a5a86;
}

/* Smart shopping list */
.smart-list-panel {
    margin-bottom: 24px;
    padding: 22px;
}

.smart-list-head p {
    margin: 5px 0 0;
    color: var(--muted);
    font-weight: 800;
}

.smart-list-score {
    min-width: 132px;
    padding: 14px 16px;
    border: 1px solid var(--line);
    border-radius: 16px;
    background: #fff;
    text-align: right;
}

.smart-list-score strong,
.smart-item strong {
    display: block;
    color: var(--rosa-700);
    font-family: var(--font-display);
    font-size: 2rem;
    line-height: 1;
}

.smart-list-score span {
    color: var(--muted);
    font-size: 0.78rem;
    font-weight: 900;
}

.smart-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
    margin-bottom: 15px;
}

.smart-list-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
}

.smart-item {
    min-height: 142px;
    display: flex;
    justify-content: space-between;
    gap: 12px;
    padding: 15px;
    border: 1px solid var(--line);
    border-radius: var(--r);
    background: #fff;
}

.smart-item > div {
    min-width: 0;
}

.smart-item span {
    color: var(--danger);
    background: var(--danger-bg);
}

.smart-item.is-medium span {
    color: var(--warn);
    background: var(--warn-bg);
}

.smart-item h3 {
    margin-top: 9px;
    font-size: 1rem;
    line-height: 1.15;
}

.smart-item small {
    display: block;
    margin-top: 8px;
    color: var(--muted);
    font-weight: 850;
    line-height: 1.35;
}

.smart-item strong {
    flex: 0 0 auto;
    font-size: 1.6rem;
}

.smart-empty,
.do-not-buy {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
    padding: 14px;
    border-radius: var(--r);
}

.smart-empty {
    background: var(--ok-bg);
    color: var(--ok);
    font-weight: 900;
}

.smart-empty span {
    color: #56725f;
}

.do-not-buy {
    margin-top: 14px;
    background: var(--roxo-bg);
    color: #6a5a86;
    font-weight: 900;
}

.do-not-buy > div {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-right: 4px;
}

.do-not-buy span {
    background: rgba(255, 255, 255, 0.72);
    color: #6a5a86;
}

/* Purchase guardrails */
.guardrails-panel {
    margin-bottom: 24px;
    padding: 22px;
}

.guardrails-head p {
    margin: 5px 0 0;
    color: var(--muted);
    font-weight: 800;
    line-height: 1.45;
}

.guardrails-summary {
    min-width: 208px;
    padding: 14px 16px;
    border-radius: var(--r);
    background: var(--roxo-bg);
    color: #6a5a86;
    text-align: right;
}

.guardrails-summary strong,
.guardrails-summary span {
    display: block;
}

.guardrails-summary strong {
    font-family: var(--font-display);
    font-size: 1.24rem;
    line-height: 1;
    white-space: nowrap;
}

.guardrails-summary span {
    margin-top: 5px;
    font-size: 0.75rem;
    font-weight: 920;
}

.guardrails-metrics {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
    margin-bottom: 14px;
}

.guardrails-metrics article {
    min-height: 82px;
    padding: 14px;
    border: 1px solid var(--line);
    border-radius: var(--r);
    background: var(--rosa-50);
}

.guardrails-metrics span {
    display: block;
    color: #a8607e;
    font-size: 0.74rem;
    font-weight: 950;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.guardrails-metrics strong {
    display: block;
    margin-top: 7px;
    color: var(--ink);
    font-family: var(--font-display);
    font-size: 1.28rem;
    line-height: 1.05;
}

.guardrails-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 14px;
}

.guardrails-column {
    min-width: 0;
    display: grid;
    gap: 12px;
    align-content: start;
    padding: 16px;
    border: 1px solid var(--line);
    border-radius: var(--r);
    background: #fff;
}

.guardrails-column.is-allowed {
    background: var(--rosa-50);
}

.guardrails-column-head {
    display: flex;
    align-items: center;
    gap: 11px;
}

.guardrails-column-head > svg {
    width: 40px;
    height: 40px;
    padding: 9px;
    border-radius: 14px;
    background: var(--roxo-bg);
    color: #6a5a86;
}

.guardrails-column.is-allowed .guardrails-column-head > svg {
    background: var(--rosa-100);
    color: var(--rosa-600);
}

.guardrails-column-head h3 {
    margin-top: 3px;
    font-size: 1.12rem;
    line-height: 1.12;
}

.guardrail-list,
.allowed-buy-list {
    display: grid;
    gap: 9px;
}

.guardrail-pause-item,
.allowed-buy-item {
    min-width: 0;
    display: grid;
    align-items: center;
    gap: 10px;
    min-height: 70px;
    padding: 11px;
    border: 1px solid var(--line);
    border-radius: 14px;
    background: #fff;
}

.guardrail-pause-item {
    grid-template-columns: 38px minmax(0, 1fr) auto;
}

.allowed-buy-item {
    grid-template-columns: 38px minmax(0, 1fr) auto;
}

.guardrail-pause-item > svg,
.allowed-buy-item > svg {
    width: 38px;
    height: 38px;
    padding: 8px;
    border-radius: 13px;
    background: var(--roxo-bg);
    color: #6a5a86;
}

.allowed-buy-item > svg {
    background: var(--rosa-100);
    color: var(--rosa-600);
}

.allowed-buy-item.is-critical > svg {
    background: var(--danger-bg);
    color: var(--danger);
}

.allowed-buy-item.is-high > svg {
    background: var(--warn-bg);
    color: var(--warn);
}

.guardrail-pause-item div,
.allowed-buy-item div {
    min-width: 0;
}

.guardrail-pause-item strong,
.guardrail-pause-item span,
.guardrail-pause-item small,
.allowed-buy-item strong,
.allowed-buy-item span {
    display: block;
}

.guardrail-pause-item strong,
.allowed-buy-item strong {
    overflow: hidden;
    color: var(--ink);
    font-family: var(--font-display);
    font-size: 0.98rem;
    line-height: 1.12;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.guardrail-pause-item span,
.allowed-buy-item span {
    margin-top: 3px;
    overflow: hidden;
    color: var(--muted);
    font-size: 0.76rem;
    font-weight: 850;
    line-height: 1.25;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.guardrail-pause-item small {
    margin-top: 4px;
    color: #6a5a86;
    font-size: 0.74rem;
    font-weight: 850;
    line-height: 1.3;
}

.guardrail-pause-item em,
.allowed-buy-item small {
    color: var(--ink);
    font-family: var(--font-display);
    font-size: 0.9rem;
    font-style: normal;
    line-height: 1.05;
    text-align: right;
    white-space: nowrap;
}

.guardrail-empty {
    min-height: 92px;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 14px;
    border-radius: var(--r);
    background: var(--ok-bg);
    color: var(--ok);
    font-weight: 900;
}

.guardrail-empty svg {
    width: 22px;
    height: 22px;
}

.guardrails-rules {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 14px;
}

.guardrails-rules span {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    min-height: 34px;
    padding: 0 12px;
    border-radius: var(--r-pill);
    background: var(--roxo-bg);
    color: #6a5a86;
    font-size: 0.76rem;
    font-weight: 900;
}

.guardrails-rules svg {
    width: 16px;
    height: 16px;
    flex: 0 0 auto;
}

.guardrails-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
    margin-top: 14px;
}

/* Budget planner */
.budget-panel {
    margin-bottom: 24px;
    padding: 22px;
}

.budget-head p {
    margin: 5px 0 0;
    color: var(--muted);
    font-weight: 800;
    line-height: 1.45;
}

.budget-summary {
    min-width: 190px;
    padding: 14px 16px;
    border-radius: var(--r);
    background: var(--warn-bg);
    color: var(--warn);
    text-align: right;
}

.budget-summary strong,
.budget-summary span {
    display: block;
}

.budget-summary strong {
    font-family: var(--font-display);
    font-size: 1.35rem;
    line-height: 1;
    white-space: nowrap;
}

.budget-summary span {
    margin-top: 5px;
    font-size: 0.75rem;
    font-weight: 900;
}

.budget-metrics {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
    margin-bottom: 12px;
}

.budget-metrics article {
    min-height: 84px;
    padding: 14px;
    border: 1px solid var(--line);
    border-radius: var(--r);
    background: var(--rosa-50);
}

.budget-metrics span {
    display: block;
    color: #a8607e;
    font-size: 0.74rem;
    font-weight: 950;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.budget-metrics strong {
    display: block;
    margin-top: 7px;
    color: var(--ink);
    font-family: var(--font-display);
    font-size: 1.38rem;
    line-height: 1.05;
}

.budget-guidance {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 14px;
}

.budget-guidance span {
    display: inline-flex;
    align-items: center;
    min-height: 32px;
    padding: 0 12px;
    border-radius: var(--r-pill);
    background: var(--rosa-100);
    color: #a8607e;
    font-size: 0.76rem;
    font-weight: 900;
}

.budget-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.25fr) minmax(260px, 0.75fr);
    gap: 14px;
    align-items: start;
}

.budget-line-list {
    display: grid;
    gap: 10px;
}

.budget-line {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr) auto;
    align-items: center;
    gap: 12px;
    min-height: 86px;
    padding: 13px;
    border: 1px solid var(--line);
    border-radius: var(--r);
    background: #fff;
}

.budget-line-icon {
    width: 42px;
    height: 42px;
    display: grid;
    place-items: center;
    border-radius: 14px;
    background: var(--rosa-100);
    color: var(--rosa-600);
}

.budget-line-icon svg {
    width: 21px;
    height: 21px;
}

.budget-line span {
    display: block;
    color: #a8607e;
    font-size: 0.72rem;
    font-weight: 950;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.budget-line h3 {
    margin-top: 4px;
    font-size: 1rem;
    line-height: 1.14;
}

.budget-line small {
    display: block;
    margin-top: 5px;
    color: var(--muted);
    font-weight: 850;
    line-height: 1.3;
}

.budget-line > strong {
    max-width: 128px;
    color: var(--ink);
    font-family: var(--font-display);
    font-size: 1.1rem;
    line-height: 1.08;
    text-align: right;
}

.budget-line.is-critical .budget-line-icon,
.budget-line.is-critical > strong {
    color: var(--danger);
}

.budget-line.is-critical .budget-line-icon {
    background: var(--danger-bg);
}

.budget-line.is-high .budget-line-icon,
.budget-line.is-high > strong {
    color: var(--warn);
}

.budget-line.is-high .budget-line-icon {
    background: var(--warn-bg);
}

.budget-side {
    display: grid;
    gap: 12px;
}

.budget-side-card {
    display: grid;
    gap: 9px;
    padding: 15px;
    border: 1px solid var(--line);
    border-radius: var(--r);
    background: #fff;
}

.budget-category-row,
.budget-phase-row {
    min-height: 36px;
    display: grid;
    align-items: center;
    gap: 8px;
    color: var(--ink-2);
    font-weight: 900;
}

.budget-category-row {
    grid-template-columns: 28px minmax(0, 1fr) auto;
}

.budget-phase-row {
    grid-template-columns: minmax(0, 1fr) auto;
}

.budget-category-row svg {
    width: 28px;
    height: 28px;
    padding: 6px;
    border-radius: 10px;
    background: var(--rosa-100);
    color: var(--rosa-600);
}

.budget-category-row span,
.budget-phase-row span {
    min-width: 0;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.budget-category-row strong,
.budget-phase-row strong {
    font-family: var(--font-display);
    font-size: 0.95rem;
    white-space: nowrap;
}

.budget-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
    margin-top: 14px;
}

.budget-store-strip {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
    margin-top: 14px;
}

.budget-store-strip a {
    min-height: 78px;
    padding: 13px;
    border: 1px solid var(--line);
    border-radius: var(--r);
    background: var(--rosa-50);
    color: var(--ink);
    text-decoration: none;
}

.budget-store-strip strong,
.budget-store-strip span {
    display: block;
}

.budget-store-strip strong {
    font-family: var(--font-display);
    font-size: 0.98rem;
    line-height: 1.1;
}

.budget-store-strip span {
    margin-top: 6px;
    color: var(--muted);
    font-size: 0.76rem;
    font-weight: 850;
    line-height: 1.3;
}

.budget-disclaimer {
    margin: 12px 0 0;
    color: var(--muted);
    font-size: 0.78rem;
    font-weight: 850;
    line-height: 1.4;
}

/* Store shopping packs */
.store-packs-panel {
    margin-bottom: 24px;
    padding: 22px;
}

.store-packs-head p {
    margin: 5px 0 0;
    color: var(--muted);
    font-weight: 800;
    line-height: 1.45;
}

.store-packs-summary {
    min-width: 214px;
    padding: 14px 16px;
    border-radius: var(--r);
    background: var(--ok-bg);
    color: var(--ok);
    text-align: right;
}

.store-packs-summary strong,
.store-packs-summary span {
    display: block;
}

.store-packs-summary strong {
    font-family: var(--font-display);
    font-size: 1.28rem;
    line-height: 1;
    white-space: nowrap;
}

.store-packs-summary span {
    margin-top: 5px;
    font-size: 0.75rem;
    font-weight: 900;
}

.store-packs-next {
    display: flex;
    align-items: center;
    gap: 10px;
    min-height: 44px;
    margin-bottom: 12px;
    padding: 0 14px;
    border-radius: var(--r);
    background: var(--rosa-100);
    color: #a8607e;
    font-weight: 920;
}

.store-packs-next svg {
    width: 19px;
    height: 19px;
    flex: 0 0 auto;
}

.store-packs-metrics {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
    margin-bottom: 14px;
}

.store-packs-metrics article {
    min-height: 82px;
    padding: 14px;
    border: 1px solid var(--line);
    border-radius: var(--r);
    background: var(--rosa-50);
}

.store-packs-metrics span {
    display: block;
    color: #a8607e;
    font-size: 0.74rem;
    font-weight: 950;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.store-packs-metrics strong {
    display: block;
    margin-top: 7px;
    color: var(--ink);
    font-family: var(--font-display);
    font-size: 1.36rem;
    line-height: 1.05;
}

.store-packs-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}

.store-pack-card {
    min-width: 0;
    display: grid;
    gap: 12px;
    padding: 16px;
    border: 1px solid var(--line);
    border-radius: var(--r);
    background: #fff;
}

.store-pack-card-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}

.store-pack-card-head > div {
    min-width: 0;
}

.store-pack-card-head span {
    display: block;
    color: #a8607e;
    font-size: 0.74rem;
    font-weight: 950;
    letter-spacing: 0.04em;
    line-height: 1.2;
    text-transform: uppercase;
}

.store-pack-card-head h3 {
    margin-top: 4px;
    font-size: 1.18rem;
    line-height: 1.13;
}

.store-pack-card-head small {
    display: block;
    margin-top: 5px;
    color: var(--muted);
    font-weight: 850;
    line-height: 1.3;
}

.store-pack-card-head strong {
    min-width: 52px;
    min-height: 40px;
    display: grid;
    place-items: center;
    border-radius: 13px;
    background: var(--ok-bg);
    color: var(--ok);
    font-family: var(--font-display);
}

.store-pack-card p {
    margin: 0;
    color: var(--ink-2);
    font-weight: 780;
    line-height: 1.42;
}

.store-pack-mission,
.store-pack-guardrail {
    display: grid;
    grid-template-columns: 30px minmax(0, 1fr);
    align-items: center;
    gap: 8px;
    min-height: 42px;
    padding: 9px 10px;
    border-radius: var(--r);
    font-size: 0.82rem;
    font-weight: 900;
    line-height: 1.3;
}

.store-pack-mission {
    background: var(--roxo-bg);
    color: #6a5a86;
}

.store-pack-guardrail {
    background: var(--warn-bg);
    color: var(--warn);
}

.store-pack-mission svg,
.store-pack-guardrail svg {
    width: 30px;
    height: 30px;
    padding: 7px;
    border-radius: 11px;
    background: rgba(255, 255, 255, 0.72);
}

.store-pack-totals {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
}

.store-pack-totals span {
    display: inline-flex;
    align-items: center;
    min-height: 30px;
    padding: 0 10px;
    border-radius: var(--r-pill);
    background: var(--roxo-bg);
    color: #6a5a86;
    font-size: 0.73rem;
    font-weight: 920;
}

.store-pack-mix {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
}

.store-pack-mix span {
    min-height: 28px;
    display: inline-flex;
    align-items: center;
    padding: 0 9px;
    border-radius: var(--r-pill);
    background: var(--rosa-100);
    color: #a8607e;
    font-size: 0.7rem;
    font-weight: 950;
}

.store-pack-mix span.is-soft {
    background: var(--roxo-bg);
    color: #6a5a86;
}

.store-pack-items {
    display: grid;
    gap: 8px;
}

.store-pack-item {
    min-width: 0;
    display: grid;
    grid-template-columns: 36px minmax(0, 1fr) auto;
    align-items: center;
    gap: 10px;
    min-height: 58px;
    padding: 10px;
    border: 1px solid var(--line);
    border-radius: 14px;
    background: var(--rosa-50);
}

.store-pack-item svg {
    width: 36px;
    height: 36px;
    padding: 8px;
    border-radius: 12px;
    background: var(--rosa-100);
    color: var(--rosa-600);
}

.store-pack-item.is-critical svg {
    background: var(--danger-bg);
    color: var(--danger);
}

.store-pack-item.is-high svg {
    background: var(--warn-bg);
    color: var(--warn);
}

.store-pack-item div {
    min-width: 0;
}

.store-pack-item strong,
.store-pack-item span {
    display: block;
}

.store-pack-item strong {
    color: var(--ink);
    font-family: var(--font-display);
    font-size: 0.98rem;
    line-height: 1.12;
}

.store-pack-item span {
    margin-top: 3px;
    color: var(--muted);
    font-size: 0.76rem;
    font-weight: 850;
    line-height: 1.25;
}

.store-pack-item small {
    color: var(--ink);
    font-family: var(--font-display);
    font-size: 0.9rem;
    line-height: 1.05;
    text-align: right;
    white-space: nowrap;
}

.store-pack-more {
    min-height: 34px;
    display: grid;
    place-items: center;
    border-radius: 14px;
    background: var(--rosa-100);
    color: #a8607e;
    font-size: 0.82rem;
    font-weight: 920;
}

.store-pack-foot {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: auto;
}

.store-pack-foot > span {
    min-width: 0;
    color: var(--muted);
    font-size: 0.78rem;
    font-weight: 850;
    line-height: 1.32;
}

.store-pack-foot .store-actions .icon-button {
    width: 38px;
    height: 38px;
    border-radius: 12px;
}

.store-packs-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
    margin-top: 14px;
}

.store-packs-alerts {
    display: grid;
    gap: 8px;
    margin-top: 14px;
}

.store-packs-alerts span {
    display: flex;
    align-items: flex-start;
    gap: 9px;
    padding: 12px 14px;
    border-radius: var(--r);
    background: var(--warn-bg);
    color: var(--warn);
    font-size: 0.84rem;
    font-weight: 850;
    line-height: 1.4;
}

.store-packs-alerts svg {
    width: 18px;
    height: 18px;
    flex: 0 0 auto;
}

.store-pack-checklist {
    display: grid;
    gap: 7px;
}

.store-pack-checklist span {
    min-width: 0;
    display: grid;
    grid-template-columns: 28px minmax(0, 1fr);
    align-items: center;
    gap: 8px;
    min-height: 34px;
    color: var(--ink-2);
    font-size: 0.78rem;
    font-weight: 850;
    line-height: 1.28;
}

.store-pack-checklist svg {
    width: 28px;
    height: 28px;
    padding: 6px;
    border-radius: 10px;
    background: var(--rosa-100);
    color: var(--rosa-600);
}

/* Orlando stores */
.orlando-panel {
    margin-bottom: 24px;
    padding: 22px;
    border: 1px solid var(--line);
    border-radius: var(--r-lg);
    background: var(--paper);
    box-shadow: var(--shadow-card);
}

.orlando-head p {
    margin: 5px 0 0;
    color: var(--muted);
    font-weight: 800;
    line-height: 1.45;
}

.orlando-summary {
    min-width: 132px;
    padding: 13px 15px;
    border-radius: var(--r);
    background: var(--rosa-100);
    color: #a8607e;
    text-align: center;
}

.orlando-summary strong,
.orlando-summary span {
    display: block;
}

.orlando-summary strong {
    font-family: var(--font-display);
    font-size: 1.65rem;
    line-height: 1;
}

.orlando-summary span {
    margin-top: 4px;
    font-size: 0.75rem;
    font-weight: 900;
}

.store-disclosure,
.store-alert,
.store-match-line,
.store-address {
    display: flex;
    align-items: flex-start;
    gap: 9px;
}

.store-disclosure {
    padding: 13px 15px;
    border-radius: var(--r);
    background: var(--roxo-bg);
    color: #6a5a86;
    font-size: 0.88rem;
    font-weight: 850;
    line-height: 1.45;
}

.store-disclosure svg,
.store-alert svg,
.store-match-line svg,
.store-address svg {
    width: 18px;
    height: 18px;
    flex: 0 0 auto;
}

.store-filter-row {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 16px 0;
}

.store-filter-row button {
    min-height: 38px;
    border: 0;
    border-radius: var(--r-pill);
    background: var(--rosa-100);
    color: #a8607e;
    cursor: pointer;
    font-size: 0.82rem;
    font-weight: 950;
    padding: 0 13px;
}

.store-filter-row button.is-selected {
    background: var(--rosa-500);
    color: #fff;
    box-shadow: var(--shadow-btn);
}

.shopping-route {
    position: relative;
    display: grid;
    gap: 15px;
    margin: 4px 0 16px;
    padding: 18px;
    overflow: hidden;
    border: 1px solid var(--line-2);
    border-radius: var(--r);
    background:
        linear-gradient(180deg, rgba(255, 246, 250, 0.94), rgba(255, 255, 255, 0.98)),
        repeating-linear-gradient(90deg, rgba(255, 143, 184, 0.08) 0 12px, rgba(255, 255, 255, 0) 12px 24px);
}

.shopping-route::before {
    content: "";
    position: absolute;
    inset: 70px 22px auto;
    height: 2px;
    border-radius: var(--r-pill);
    background: linear-gradient(90deg, rgba(255, 143, 184, 0.18), rgba(156, 124, 232, 0.28), rgba(255, 143, 184, 0.18));
}

.route-head {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
}

.route-head h3 {
    font-size: 1.28rem;
    line-height: 1.12;
}

.route-head p {
    max-width: 720px;
    margin: 5px 0 0;
    color: var(--muted);
    font-weight: 820;
    line-height: 1.42;
}

.route-steps {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
}

.route-step {
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr);
    gap: 11px;
    min-height: 222px;
    padding: 14px;
    border: 1px solid rgba(242, 226, 234, 0.92);
    border-radius: var(--r);
    background: rgba(255, 255, 255, 0.92);
}

.route-step-number {
    width: 38px;
    height: 38px;
    display: grid;
    place-items: center;
    border-radius: 13px;
    background: var(--grad-rosa);
    color: #fff;
    font-family: var(--font-display);
    font-weight: 850;
    box-shadow: var(--shadow-card);
}

.route-step span {
    display: block;
    color: #a8607e;
    font-size: 0.74rem;
    font-weight: 950;
    letter-spacing: 0.04em;
    line-height: 1.2;
    text-transform: uppercase;
}

.route-step h4 {
    margin: 5px 0 7px;
    color: var(--ink);
    font-family: var(--font-display);
    font-size: 1.02rem;
    line-height: 1.12;
}

.route-step p {
    margin: 0;
    color: var(--ink-2);
    font-size: 0.84rem;
    font-weight: 780;
    line-height: 1.38;
}

.route-buy {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 10px;
}

.route-buy small {
    display: inline-flex;
    align-items: center;
    min-height: 28px;
    padding: 0 9px;
    border-radius: var(--r-pill);
    background: var(--rosa-100);
    color: #a8607e;
    font-size: 0.72rem;
    font-weight: 900;
    line-height: 1.2;
}

.route-foot {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-top: 12px;
}

.route-foot strong {
    min-width: 0;
    color: var(--muted);
    font-size: 0.78rem;
    font-weight: 950;
    line-height: 1.2;
}

.route-foot .store-actions .icon-button {
    width: 36px;
    height: 36px;
    border-radius: 12px;
}

.orlando-layout {
    display: grid;
    grid-template-columns: minmax(260px, 0.72fr) minmax(0, 1.28fr);
    gap: 16px;
    align-items: start;
}

.store-route-card,
.store-card,
.store-empty {
    border: 1px solid var(--line);
    border-radius: var(--r);
    background: #fff;
}

.store-route-card {
    position: sticky;
    top: 18px;
    display: grid;
    gap: 12px;
    padding: 18px;
}

.store-route-card h3 {
    font-size: 1.35rem;
    line-height: 1.12;
}

.store-route-card p,
.store-card p {
    margin: 0;
    color: var(--ink-2);
    font-weight: 780;
    line-height: 1.45;
}

.store-match-line {
    color: var(--ok);
    font-size: 0.86rem;
    font-weight: 950;
}

.need-chips,
.store-tags,
.store-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
}

.need-chips span,
.store-tags span,
.store-meta span {
    display: inline-flex;
    align-items: center;
    min-height: 28px;
    padding: 0 10px;
    border-radius: var(--r-pill);
    font-size: 0.72rem;
    font-weight: 900;
}

.need-chips span,
.store-tags span {
    background: var(--rosa-100);
    color: #a8607e;
}

.store-tags span.is-soft,
.store-meta span {
    background: var(--roxo-bg);
    color: #6a5a86;
}

.store-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}

.store-card {
    display: grid;
    gap: 12px;
    min-height: 278px;
    padding: 16px;
}

.store-card-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}

.store-card-head span {
    display: block;
    color: #a8607e;
    font-size: 0.76rem;
    font-weight: 950;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.store-card-head h3 {
    margin-top: 4px;
    font-size: 1.08rem;
    line-height: 1.16;
}

.store-card-head strong {
    min-width: 48px;
    min-height: 38px;
    display: grid;
    place-items: center;
    border-radius: 13px;
    background: var(--ok-bg);
    color: var(--ok);
    font-family: var(--font-display);
}

.store-address {
    color: var(--muted);
    font-size: 0.82rem;
    font-weight: 850;
    line-height: 1.35;
}

.store-card-foot {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: auto;
}

.store-card-foot small {
    color: var(--muted);
    font-weight: 850;
    line-height: 1.3;
}

.store-actions {
    display: inline-flex;
    align-items: center;
    gap: 7px;
}

.store-actions .icon-button {
    width: 42px;
    height: 42px;
    flex: 0 0 auto;
}

.source-link {
    min-width: 52px;
    min-height: 42px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 14px;
    background: var(--rosa-100);
    color: #a8607e;
    font-size: 0.78rem;
    font-weight: 950;
    text-decoration: none;
}

.store-empty {
    min-height: 240px;
    display: grid;
    place-items: center;
    align-content: center;
    gap: 12px;
    color: var(--muted);
    text-align: center;
    padding: 22px;
}

.store-empty svg {
    width: 38px;
    height: 38px;
    color: var(--rosa-600);
}

.store-alerts {
    display: grid;
    gap: 9px;
    margin-top: 14px;
}

.store-alert {
    padding: 12px 14px;
    border-radius: var(--r);
    color: #6a5a86;
    background: var(--roxo-bg);
    font-size: 0.86rem;
    font-weight: 850;
    line-height: 1.4;
}

.store-alert.is-warning {
    color: var(--warn);
    background: var(--warn-bg);
}

/* Inventory */
.inventory-section {
    margin-bottom: 24px;
}

.inventory-head,
.section-title {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 16px;
    margin: 0 0 16px;
}

.inventory-head h2,
.section-title h2 {
    font-size: 1.9rem;
}

.filters {
    display: grid;
    grid-template-columns: minmax(210px, 300px) 145px 46px 46px;
    gap: 9px;
    align-items: end;
}

input,
select,
textarea {
    width: 100%;
    min-height: 46px;
    border: 1.5px solid var(--rosa-200);
    border-radius: 14px;
    background: #fff;
    color: var(--ink);
    padding: 0 14px;
    font-weight: 700;
    outline: none;
}

textarea {
    min-height: 96px;
    padding-top: 12px;
    resize: vertical;
    line-height: 1.45;
}

input:focus,
select:focus,
textarea:focus {
    border-color: var(--rosa-500);
    box-shadow: 0 0 0 3px rgba(255, 111, 165, 0.16);
}

.inventory-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(210px, 1fr));
    gap: 18px;
}

.item-card {
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: 22px;
    background: #fff;
    box-shadow: var(--shadow-card);
    transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.item-card:hover {
    transform: translateY(-3px);
    box-shadow: var(--shadow-pop);
}

.item-photo {
    position: relative;
    height: 154px;
    margin: 12px 12px 0;
    overflow: hidden;
    border-radius: var(--r);
    background: var(--ph-1);
}

.item-card:nth-child(6n + 2) .item-photo {
    background: var(--ph-2);
}

.item-card:nth-child(6n + 3) .item-photo {
    background: var(--ph-3);
}

.item-card:nth-child(6n + 4) .item-photo {
    background: var(--ph-4);
}

.item-card:nth-child(6n + 5) .item-photo {
    background: var(--ph-5);
}

.item-card:nth-child(6n + 6) .item-photo {
    background: var(--ph-6);
}

.item-photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.item-photo img[src$="placeholder-roupinha.svg"] {
    object-fit: contain;
    padding: 18px;
}

.size-badge,
.quantity-badge {
    position: absolute;
    display: inline-grid;
    place-items: center;
    min-height: 28px;
    padding: 0 10px;
    border-radius: 10px;
    font-size: 0.72rem;
    font-weight: 900;
}

.size-badge {
    top: 10px;
    right: 10px;
    background: #fff;
    color: #a8607e;
}

.quantity-badge {
    left: 10px;
    bottom: 10px;
    background: rgba(255, 255, 255, 0.92);
    color: #a8607e;
}

.item-body {
    padding: 12px 15px 15px;
}

.item-title {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
}

.item-title h3 {
    min-width: 0;
    font-size: 1rem;
    line-height: 1.18;
}

.analysis-state {
    flex: 0 0 auto;
    min-height: 24px;
    padding: 4px 9px;
    border-radius: 9px;
    background: var(--warn-bg);
    color: var(--warn);
    font-size: 0.68rem;
    font-weight: 900;
}

.analysis-state.is-complete {
    color: var(--ok);
    background: var(--ok-bg);
}

.analysis-state.is-queued {
    color: #8b5d10;
    background: #fff7d7;
}

.analysis-state.is-error {
    color: var(--warn);
    background: var(--warn-bg);
}

.chip-row,
.tag-row {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 10px;
}

.lifecycle-pill {
    width: fit-content;
    min-height: 30px;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    margin-top: 10px;
    padding: 0 10px;
    border-radius: 10px;
    background: #fff4fa;
    color: #9a4d70;
    font-size: 0.74rem;
    font-weight: 900;
}

.lifecycle-pill svg {
    width: 15px;
    height: 15px;
}

.lifecycle-pill.is-em_uso {
    background: var(--ok-bg);
    color: var(--ok);
}

.lifecycle-pill.is-ficou_pequena,
.lifecycle-pill.is-doar_vender {
    background: #f7f2ff;
    color: #7654a6;
}

.item-body p {
    display: -webkit-box;
    margin: 10px 0 0;
    overflow: hidden;
    color: var(--ink-2);
    font-size: 0.86rem;
    line-height: 1.45;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.shopping-note,
.error-line,
.note-line {
    margin-top: 11px;
    padding: 12px 14px;
    border-radius: 18px;
    font-size: 0.86rem;
    font-weight: 750;
    line-height: 1.4;
}

.shopping-note {
    display: flex;
    gap: 8px;
    background: #fff7ec;
    color: #6b5326;
}

.error-line {
    display: flex;
    gap: 8px;
    color: var(--danger);
    background: var(--danger-bg);
}

.shopping-note svg,
.error-line svg,
.note-line svg {
    width: 18px;
    height: 18px;
    flex: 0 0 auto;
}

.edit-panel {
    margin-top: 12px;
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: var(--r);
    background: var(--cream);
}

.edit-panel summary {
    min-height: 42px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 0 12px;
    list-style: none;
    cursor: pointer;
    color: #a8607e;
    font-weight: 900;
}

.edit-panel summary::-webkit-details-marker {
    display: none;
}

.edit-grid {
    display: grid;
    grid-template-columns: 1fr 0.8fr 0.45fr;
    gap: 10px;
    padding: 12px;
}

.edit-wide,
.edit-save {
    grid-column: 1 / -1;
}

.edit-grid input,
.edit-grid select {
    min-height: 42px;
}

.card-actions {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    margin-top: 12px;
}

.card-actions form {
    margin: 0;
}

/* Phase and planning */
.phase-panel {
    margin-bottom: 24px;
    padding: 22px;
}

.phase-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 16px;
}

.phase-card {
    min-height: 168px;
    padding: 18px;
    border: 1px solid var(--line);
    border-radius: var(--r-lg);
    background: #fff;
}

.phase-card-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.phase-card-head strong {
    font-family: var(--font-display);
    font-size: 1.08rem;
}

.phase-card-head span {
    color: var(--danger);
    font-family: var(--font-display);
    font-size: 1.35rem;
    font-weight: 700;
}

.phase-card.is-close .phase-card-head span {
    color: var(--warn);
}

.phase-card.is-complete .phase-card-head span {
    color: var(--ok);
}

.phase-card p {
    margin: 10px 0;
    color: var(--muted);
    font-weight: 800;
}

.phase-missing {
    display: grid;
    gap: 6px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.phase-missing li {
    color: var(--ink-2);
    font-size: 0.86rem;
    font-weight: 800;
}

.phase-missing span {
    color: #a8607e;
    font-weight: 950;
}

.phase-ok {
    min-height: 31px;
    padding: 0 11px;
    border-radius: var(--r-pill);
    background: var(--ok-bg);
    color: var(--ok);
    font-weight: 900;
}

/* Workbench */
.workbench {
    display: grid;
    grid-template-columns: minmax(320px, 0.96fr) minmax(320px, 1.04fr);
    gap: 18px;
    align-items: stretch;
    margin: 0 0 22px;
}

.wardrobe-rail {
    display: none;
}

.tool-panel {
    padding: 22px;
}

.panel-title {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 18px;
}

.panel-title h2 {
    font-size: 1.5rem;
}

.panel-title svg {
    width: 26px;
    height: 26px;
    color: var(--rosa-600);
}

.photo-drop {
    position: relative;
    display: grid;
    place-items: center;
    width: 100%;
    aspect-ratio: 1 / 0.78;
    min-height: 230px;
    overflow: hidden;
    border: 2px dashed #f2c4d6;
    border-radius: var(--r-lg);
    background: var(--rosa-50);
    cursor: pointer;
}

.photo-drop input {
    position: absolute;
    inset: 0;
    opacity: 0;
    cursor: pointer;
}

.photo-drop img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.photo-empty {
    display: grid;
    justify-items: center;
    gap: 10px;
    color: var(--muted);
    text-align: center;
}

.photo-empty svg {
    width: 34px;
    height: 34px;
    color: var(--rosa-600);
}

.field-grid {
    display: grid;
    grid-template-columns: 1fr 0.68fr 0.35fr;
    gap: 12px;
    margin-top: 16px;
}

.size-shortcuts {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 12px;
}

.size-shortcuts button {
    min-width: 48px;
    min-height: 38px;
    border: 0;
    border-radius: 13px;
    background: var(--rosa-100);
    color: #a8607e;
    cursor: pointer;
    font-weight: 900;
}

.size-shortcuts button.is-selected {
    background: var(--rosa-500);
    color: #fff;
}

.check-row {
    margin-top: 14px;
    color: var(--ink);
    font-weight: 850;
}

.check-row input {
    width: 18px;
    height: 18px;
    min-height: auto;
    accent-color: var(--rosa-500);
}

.check-row span,
.check-row em {
    margin: 0;
}

.check-row em {
    color: #a8607e;
    font-size: 0.82rem;
    font-style: normal;
    font-weight: 900;
}

.check-row.is-disabled {
    color: var(--muted);
}

.missing-list {
    display: grid;
    gap: 10px;
}

.missing-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    min-height: 66px;
    padding: 12px 14px;
    border: 1px solid var(--line);
    border-radius: 18px;
    background: #fff;
}

.missing-item > div {
    flex: 1 1 auto;
}

.missing-item span,
.missing-item small {
    display: block;
}

.missing-item span {
    font-family: var(--font-display);
    font-weight: 650;
}

.missing-item small {
    margin-top: 2px;
    color: var(--muted);
    font-weight: 750;
}

.missing-item strong {
    color: #a8607e;
    font-family: var(--font-display);
    font-size: 1.2rem;
}

.note-line {
    width: 100%;
    background: var(--roxo-bg);
    color: #6a5a86;
}

.ai-tips {
    margin-top: 12px;
    padding: 15px 17px;
    border: 1px solid #eadcf8;
    border-radius: 18px;
    background: var(--roxo-bg);
    color: #6a5a86;
    line-height: 1.5;
}

.inline-action {
    margin: 0;
}

.inline-action + .inline-action .button {
    margin-top: 10px;
}

.empty-copy {
    margin: 0;
    color: var(--muted);
    font-weight: 800;
}

/* Buttons */
.button,
.icon-button {
    border: 0;
    cursor: pointer;
    text-decoration: none;
    transition: transform 0.15s ease, filter 0.15s ease, box-shadow 0.15s ease;
}

.button {
    min-height: 46px;
    justify-content: center;
    margin-top: 14px;
    padding: 0 18px;
    border-radius: var(--r);
    font-family: var(--font-display);
    font-weight: 700;
}

.button svg,
.icon-button svg {
    width: 18px;
    height: 18px;
}

.button.primary {
    width: 100%;
    background: var(--grad-btn);
    color: #fff;
    box-shadow: var(--shadow-btn);
}

.button.secondary {
    width: 100%;
    background: var(--grad-ia);
    color: #fff;
}

.button.soft {
    width: 100%;
    background: var(--rosa-100);
    color: #a8607e;
}

.button.compact {
    width: auto;
    min-height: 42px;
    margin-top: 2px;
}

.button:not(:disabled):hover,
.icon-button:not(:disabled):hover,
.topbar-link:hover {
    transform: translateY(-1px);
}

.button:disabled,
.icon-button:disabled {
    cursor: not-allowed;
    opacity: 0.48;
}

.icon-button {
    width: 46px;
    height: 46px;
    justify-content: center;
    border-radius: 14px;
    background: var(--rosa-500);
    color: #fff;
}

.icon-button.ghost {
    background: var(--rosa-100);
    color: #a8607e;
}

.icon-button.danger {
    background: var(--danger-bg);
    color: var(--danger);
}

/* Private AI */
.settings-panel {
    margin: 0 0 24px;
    overflow: hidden;
}

.settings-panel summary {
    justify-content: space-between;
    min-height: 64px;
    padding: 0 20px;
    list-style: none;
    cursor: pointer;
    font-family: var(--font-display);
    font-weight: 700;
}

.settings-panel summary::-webkit-details-marker {
    display: none;
}

.settings-panel summary svg {
    width: 20px;
    height: 20px;
    color: var(--roxo-600);
}

.settings-panel[open] summary {
    border-bottom: 1px solid var(--line);
}

.private-ai-panel {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 20px;
}

.private-ai-panel strong {
    display: block;
    font-family: var(--font-display);
    font-size: 1.08rem;
}

.private-ai-actions {
    margin: 0;
}

.private-ai-actions .button {
    margin-top: 0;
}

.empty-state {
    min-height: 260px;
    display: grid;
    place-items: center;
    align-content: center;
    gap: 12px;
    color: var(--muted);
    text-align: center;
}

.empty-state svg {
    width: 46px;
    height: 46px;
    color: #e7b9cc;
}

.empty-state h2 {
    font-size: 1.25rem;
}

.empty-state p {
    margin: 0;
}

/* Printable action plan */
.print-page {
    min-height: 100vh;
    background: var(--rosa-50);
}

.print-shell {
    width: min(980px, calc(100% - 32px));
    margin: 0 auto;
    padding: 28px 0;
}

.print-hero,
.print-summary,
.print-highlights,
.print-lane,
.print-footer {
    border: 1px solid var(--line);
    border-radius: var(--r-lg);
    background: #fff;
    box-shadow: var(--shadow-card);
}

.print-hero {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    padding: 24px;
}

.print-hero h1 {
    font-size: 2rem;
    line-height: 1.05;
}

.print-hero p {
    max-width: 680px;
    margin: 8px 0 0;
    color: var(--muted);
    font-weight: 800;
    line-height: 1.45;
}

.print-score {
    min-width: 130px;
    padding: 14px 16px;
    border-radius: var(--r);
    background: var(--danger-bg);
    color: var(--danger);
    text-align: center;
}

.print-score strong,
.print-score span {
    display: block;
}

.print-score strong {
    font-family: var(--font-display);
    font-size: 2rem;
    line-height: 1;
}

.print-score span {
    margin-top: 4px;
    font-size: 0.76rem;
    font-weight: 950;
}

.print-summary,
.print-highlights {
    display: grid;
    gap: 10px;
    margin-top: 14px;
    padding: 14px;
}

.print-summary {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.print-summary article,
.print-highlights article {
    min-height: 86px;
    padding: 13px;
    border-radius: var(--r);
    background: var(--rosa-50);
}

.print-summary span,
.print-highlights span {
    display: block;
    color: #a8607e;
    font-size: 0.72rem;
    font-weight: 950;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.print-summary strong,
.print-highlights strong {
    display: block;
    margin-top: 6px;
    color: var(--ink);
    font-family: var(--font-display);
    font-size: 1.1rem;
    line-height: 1.1;
}

.print-highlights {
    grid-template-columns: repeat(5, minmax(0, 1fr));
}

.print-highlights article {
    display: grid;
    gap: 5px;
}

.print-highlights svg {
    width: 30px;
    height: 30px;
    padding: 7px;
    border-radius: 12px;
    background: var(--rosa-100);
    color: var(--rosa-600);
}

.print-highlights small {
    color: var(--muted);
    font-size: 0.74rem;
    font-weight: 850;
}

.print-lanes {
    display: grid;
    gap: 14px;
    margin-top: 14px;
}

.print-lane {
    padding: 18px;
    page-break-inside: avoid;
}

.print-lane header h2 {
    font-size: 1.35rem;
}

.print-lane header p {
    margin: 5px 0 0;
    color: var(--muted);
    font-weight: 800;
}

.print-task-list {
    display: grid;
    gap: 8px;
    margin-top: 12px;
}

.print-task {
    display: grid;
    grid-template-columns: 34px minmax(0, 1fr) auto;
    align-items: center;
    gap: 10px;
    min-height: 64px;
    padding: 10px;
    border: 1px solid var(--line);
    border-radius: var(--r);
    background: var(--rosa-50);
}

.print-task svg {
    width: 34px;
    height: 34px;
    padding: 7px;
    border-radius: 12px;
    background: var(--rosa-100);
    color: var(--rosa-600);
}

.print-task.is-critical svg,
.print-task.is-high svg {
    background: var(--danger-bg);
    color: var(--danger);
}

.print-task.is-ready svg,
.print-task.is-low svg {
    background: var(--ok-bg);
    color: var(--ok);
}

.print-task strong,
.print-task span,
.print-task small {
    display: block;
}

.print-task strong {
    font-family: var(--font-display);
    font-size: 1rem;
    line-height: 1.1;
}

.print-task span {
    margin-top: 3px;
    color: var(--muted);
    font-size: 0.78rem;
    font-weight: 850;
}

.print-task small {
    padding: 6px 9px;
    border-radius: var(--r-pill);
    background: #fff;
    color: #a8607e;
    font-size: 0.7rem;
    font-weight: 950;
}

.print-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: 14px;
    padding: 14px 18px;
    color: var(--muted);
    font-size: 0.82rem;
    font-weight: 850;
}

.print-footer a {
    color: var(--rosa-600);
    font-weight: 950;
    text-decoration: none;
}

@media print {
    body.print-page {
        background: #fff;
    }

    .print-shell {
        width: 100%;
        padding: 0;
    }

    .print-hero,
    .print-summary,
    .print-highlights,
    .print-lane,
    .print-footer {
        box-shadow: none;
    }

    .print-footer a {
        display: none;
    }
}

@media (max-width: 560px) {
    .print-shell {
        width: calc(100% - 24px);
        padding: 12px 0;
    }

    .print-hero,
    .print-footer {
        align-items: stretch;
        flex-direction: column;
    }

    .print-score {
        width: fit-content;
    }

    .print-summary,
    .print-highlights {
        grid-template-columns: 1fr;
    }

    .print-task {
        grid-template-columns: 30px minmax(0, 1fr);
    }

    .print-task small {
        justify-self: start;
        grid-column: 2;
    }
}

@media (max-width: 1100px) {
    .topbar {
        width: 86px;
        flex-basis: 86px;
    }

    .brand-lockup {
        justify-content: center;
        padding-inline: 0;
    }

    .brand-lockup > div:last-child,
    .sidebar-nav span,
    .topbar-link span,
    .sidefoot div {
        display: none;
    }

    .sidebar-nav a,
    .topbar-link {
        justify-content: center;
        padding-inline: 0;
    }

    .topbar-actions .status-pill {
        width: 46px;
        padding: 0;
    }

    .topbar-actions .status-pill span {
        display: none;
    }

    .sidefoot {
        justify-content: center;
        padding-inline: 0;
    }

    .workbench {
        grid-template-columns: 1fr;
    }

    .radar-grid {
        grid-template-columns: 1fr;
    }

    .radar-actions {
        grid-row: auto;
    }

    .phase-radar-row,
    .tips-grid,
    .mission-grid,
    .action-highlights,
    .action-lanes,
    .quality-actions,
    .quality-dimension-grid,
    .quality-metrics,
    .maternity-grid,
    .maternity-steps,
    .laundry-phase-grid,
    .laundry-metrics,
    .drawer-metrics,
    .milestone-grid,
    .coverage-metrics,
    .maternity-metrics,
    .guardrails-metrics,
    .budget-metrics,
    .store-packs-metrics,
    .budget-store-strip,
    .outfit-tabs,
    .smart-list-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .store-packs-grid {
        grid-template-columns: 1fr;
    }

    .budget-layout {
        grid-template-columns: 1fr;
    }

    .guardrails-layout {
        grid-template-columns: 1fr;
    }

    .laundry-layout {
        grid-template-columns: 1fr;
    }

    .drawer-layout {
        grid-template-columns: 1fr;
    }

    .occasion-layout {
        grid-template-columns: 1fr;
    }

    .drawer-focus,
    .occasion-focus {
        position: static;
    }

    .drawer-rack {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .quality-layout {
        grid-template-columns: 1fr;
    }

    .quality-items {
        position: static;
    }

    .laundry-focus-card {
        position: static;
    }

    .budget-side {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .outfit-layout {
        grid-template-columns: 1fr;
    }

    .outfit-phase-card {
        position: static;
    }

    .route-steps {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .orlando-layout {
        grid-template-columns: 1fr;
    }

    .store-route-card {
        position: static;
    }
}

@media (max-width: 860px) {
    .app-shell {
        display: block;
        height: auto;
        overflow: visible;
    }

    .topbar {
        position: sticky;
        top: 0;
        z-index: 20;
        width: 100%;
        min-height: auto;
        flex-direction: row;
        align-items: center;
        gap: 12px;
        padding: 12px;
        border-right: 0;
        border-bottom: 1px solid var(--line);
    }

    .brand-lockup {
        padding: 0;
    }

    .brand-lockup > div:last-child {
        display: block;
    }

    .brand-lockup h1 {
        max-width: 130px;
    }

    .sidebar-nav {
        display: flex;
        min-width: 0;
        flex: 1 1 auto;
        justify-content: center;
        gap: 4px;
        overflow-x: auto;
        scrollbar-width: none;
    }

    .sidebar-nav::-webkit-scrollbar {
        display: none;
    }

    .sidebar-nav a {
        min-width: 42px;
        min-height: 42px;
        justify-content: center;
        padding: 0;
    }

    .sidebar-nav span,
    .topbar-actions,
    .sidefoot {
        display: none;
    }

    .app-main {
        height: auto;
        overflow: visible;
        padding: 20px 16px 42px;
    }

    .app-hero,
    .closet-strip,
    .first-run-panel,
    .inventory-head,
    .section-title,
    .mission-head,
    .action-plan-head,
    .quality-head,
    .maternity-head,
    .laundry-head,
    .first-year-head,
    .drawer-head,
    .coverage-head,
    .outfit-head,
    .guardrails-head,
    .budget-head,
    .store-packs-head,
    .smart-list-head,
    .private-ai-panel {
        align-items: stretch;
        flex-direction: column;
    }

    .radar-method {
        max-width: none;
        text-align: left;
    }

    .orlando-summary {
        width: fit-content;
    }

    .mission-summary {
        width: fit-content;
    }

    .action-plan-summary {
        width: fit-content;
    }

    .quality-summary {
        width: fit-content;
    }

    .maternity-summary {
        width: fit-content;
    }

    .laundry-summary {
        width: fit-content;
    }

    .first-year-summary {
        width: fit-content;
    }

    .drawer-summary {
        width: fit-content;
    }

    .coverage-summary {
        width: fit-content;
    }

    .outfit-summary {
        width: fit-content;
    }

    .budget-summary {
        width: fit-content;
        text-align: left;
    }

    .guardrails-summary {
        width: fit-content;
        text-align: left;
    }

    .store-packs-summary {
        width: fit-content;
        text-align: left;
    }

    .route-head {
        align-items: stretch;
        flex-direction: column;
    }

    .stats-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .filters {
        grid-template-columns: 1fr 1fr 46px 46px;
    }

    .field-grid,
    .edit-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 560px) {
    .app-main {
        padding-inline: 12px;
    }

    .brand-lockup h1,
    .brand-lockup span {
        display: none;
    }

    .topbar {
        gap: 8px;
        padding: 10px;
    }

    .sidebar-nav {
        justify-content: flex-start;
        gap: 2px;
    }

    .sidebar-nav a {
        min-width: 38px;
        min-height: 38px;
    }

    .stats-grid {
        gap: 10px;
    }

    .metric {
        min-height: 112px;
        padding: 16px;
    }

    .metric strong {
        font-size: 2rem;
    }

    .inventory-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 12px;
    }

    .item-photo {
        height: 116px;
        margin: 10px 10px 0;
    }

    .item-body {
        padding: 10px;
    }

    .item-title {
        display: block;
    }

    .analysis-state {
        display: inline-flex;
        align-items: center;
        margin-top: 7px;
    }

    .chip-row,
    .tag-row,
    .item-body p,
    .shopping-note,
    .error-line {
        display: none;
    }

    .edit-panel {
        margin-top: 10px;
    }

    .edit-panel summary {
        min-height: 38px;
        padding-inline: 10px;
        font-size: 0.78rem;
    }

    .card-actions {
        justify-content: flex-start;
    }

    .filters {
        grid-template-columns: 1fr 46px 46px;
    }

    .filters label:first-child {
        grid-column: 1 / -1;
    }

    .phase-panel,
    .tool-panel,
    .mission-panel,
    .action-plan-panel,
    .quality-panel,
    .maternity-panel,
    .laundry-panel,
    .first-year-panel,
    .drawer-panel,
    .occasion-panel,
    .coverage-panel,
    .outfit-panel,
    .radar-panel,
    .smart-list-panel,
    .guardrails-panel,
    .budget-panel,
    .store-packs-panel,
    .orlando-panel {
        padding: 16px;
    }

    .phase-grid,
    .mission-grid,
    .action-highlights,
    .action-lanes,
    .quality-actions,
    .quality-dimension-grid,
    .quality-metrics,
    .maternity-grid,
    .maternity-steps,
    .laundry-phase-grid,
    .laundry-row-grid,
    .laundry-metrics,
    .drawer-metrics,
    .occasion-metrics,
    .milestone-grid,
    .coverage-metrics,
    .maternity-metrics,
    .guardrails-metrics,
    .budget-metrics,
    .store-packs-metrics,
    .store-packs-grid,
    .budget-store-strip,
    .budget-side,
    .outfit-capsule-grid,
    .smart-list-grid {
        grid-template-columns: 1fr;
    }

    .drawer-transition-grid,
    .occasion-grid,
    .drawer-rack {
        grid-template-columns: 1fr;
    }

    .drawer-transition,
    .occasion-card {
        min-height: 0;
    }

    .drawer-transition-head,
    .drawer-transition-meta,
    .drawer-focus-actions,
    .occasion-focus-actions {
        align-items: stretch;
        flex-direction: column;
    }

    .drawer-focus-actions .button,
    .drawer-actions .button,
    .occasion-focus-actions .button,
    .occasion-actions .button {
        width: 100%;
    }

    .drawer-rules,
    .occasion-rules,
    .occasion-top-gaps {
        display: grid;
        grid-template-columns: 1fr;
    }

    .drawer-rules span,
    .occasion-rules span,
    .occasion-top-gaps span {
        min-height: 42px;
        padding-block: 8px;
    }

    .budget-line {
        grid-template-columns: 38px minmax(0, 1fr);
        align-items: start;
    }

    .budget-line > strong {
        grid-column: 2;
        max-width: none;
        text-align: left;
    }

    .budget-line-icon {
        width: 38px;
        height: 38px;
    }

    .budget-guidance {
        flex-wrap: nowrap;
        margin-inline: -16px;
        overflow-x: auto;
        padding: 0 16px 4px;
        scrollbar-width: none;
    }

    .budget-guidance::-webkit-scrollbar {
        display: none;
    }

    .budget-guidance span {
        flex: 0 0 auto;
        max-width: 286px;
    }

    .guardrails-column {
        padding: 14px;
    }

    .guardrail-pause-item,
    .allowed-buy-item {
        grid-template-columns: 34px minmax(0, 1fr);
        align-items: start;
    }

    .guardrail-pause-item > svg,
    .allowed-buy-item > svg {
        width: 34px;
        height: 34px;
    }

    .guardrail-pause-item em,
    .allowed-buy-item small {
        grid-column: 2;
        text-align: left;
    }

    .guardrails-rules {
        flex-wrap: wrap;
    }

    .guardrails-rules span {
        width: 100%;
        min-height: 42px;
        padding-block: 8px;
    }

    .guardrails-actions {
        display: grid;
        grid-template-columns: 1fr;
    }

    .guardrails-actions .button {
        width: 100%;
    }

    .store-pack-card {
        padding: 14px;
    }

    .store-pack-card-head,
    .store-pack-foot {
        align-items: stretch;
        flex-direction: column;
    }

    .store-pack-card-head strong {
        width: fit-content;
    }

    .store-pack-foot .store-actions {
        justify-content: flex-start;
    }

    .store-packs-actions {
        display: grid;
        grid-template-columns: 1fr;
    }

    .store-packs-actions .button {
        width: 100%;
    }

    .store-pack-item {
        grid-template-columns: 34px minmax(0, 1fr);
        align-items: start;
    }

    .store-pack-item svg {
        width: 34px;
        height: 34px;
    }

    .store-pack-item small {
        grid-column: 2;
        text-align: left;
    }

    .mission-card {
        min-height: 0;
    }

    .action-lane,
    .action-highlights article {
        min-height: 0;
    }

    .quality-dimension,
    .quality-action {
        min-height: 0;
    }

    .maternity-kit,
    .maternity-steps article,
    .laundry-row,
    .laundry-phase {
        min-height: 0;
    }

    .laundry-guidance,
    .laundry-gaps {
        flex-wrap: nowrap;
        margin-inline: -16px;
        overflow-x: auto;
        padding: 0 16px 4px;
        scrollbar-width: none;
    }

    .laundry-guidance::-webkit-scrollbar,
    .laundry-gaps::-webkit-scrollbar {
        display: none;
    }

    .laundry-guidance span,
    .laundry-gaps span {
        flex: 0 0 auto;
        max-width: 286px;
    }

    .maternity-focus {
        align-items: flex-start;
        flex-direction: column;
    }

    .year-rail {
        grid-template-columns: 1fr;
        overflow-x: visible;
    }

    .year-phase {
        min-height: 0;
    }

    .outfit-tabs,
    .outfit-gaps {
        flex-wrap: nowrap;
        margin-inline: -16px;
        overflow-x: auto;
        padding: 0 16px 4px;
        scrollbar-width: none;
    }

    .outfit-tabs {
        display: flex;
    }

    .outfit-tabs::-webkit-scrollbar,
    .outfit-gaps::-webkit-scrollbar {
        display: none;
    }

    .outfit-tabs button {
        min-width: 94px;
        flex: 0 0 auto;
    }

    .outfit-gaps span {
        flex: 0 0 auto;
        max-width: 286px;
    }

    .coverage-priorities {
        flex-wrap: nowrap;
        margin-inline: -16px;
        overflow-x: auto;
        padding: 0 16px 4px;
        scrollbar-width: none;
    }

    .coverage-priorities::-webkit-scrollbar {
        display: none;
    }

    .coverage-priorities span {
        flex: 0 0 auto;
        max-width: 280px;
    }

    .matrix-scroll {
        margin-inline: -4px;
    }

    .radar-score-card,
    .tips-grid {
        grid-template-columns: 1fr;
    }

    .radar-score-card {
        justify-items: start;
    }

    .phase-radar-row {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .priority-item {
        padding-right: 14px;
    }

    .priority-item span {
        position: static;
        justify-self: start;
        margin-top: 3px;
    }

    .store-filter-row {
        flex-wrap: nowrap;
        margin-inline: -16px;
        overflow-x: auto;
        padding: 0 16px 4px;
        scrollbar-width: none;
    }

    .store-filter-row::-webkit-scrollbar {
        display: none;
    }

    .store-filter-row button {
        flex: 0 0 auto;
    }

    .shopping-route {
        margin-inline: 0;
        padding: 14px;
    }

    .shopping-route::before {
        inset: 74px 20px auto;
    }

    .route-steps {
        grid-template-columns: 1fr;
    }

    .route-step {
        min-height: 0;
    }

    .store-grid {
        grid-template-columns: 1fr;
    }

    .store-card-foot {
        align-items: stretch;
        flex-direction: column;
    }

    .store-actions {
        justify-content: flex-start;
    }
}