/* Companion screens use the same Material 3 type, state and surface roles. */
.feature-overview{position:relative;display:flex;align-items:center;gap:16px;width:100%;min-height:80px;margin:0 0 16px;padding:16px;border:1px solid var(--md-outline-variant);border-radius:16px;background:var(--md-surface-container-low);color:var(--md-on-surface);text-align:left;font:inherit;cursor:pointer}
.overview-symbol{display:grid;place-items:center;width:40px;height:40px;flex-shrink:0;background:var(--md-secondary-container);color:var(--md-on-secondary-container);border-radius:12px}.overview-symbol svg,.overview-arrow{width:24px;height:24px}.overview-arrow{color:var(--md-on-surface-variant);flex-shrink:0}.overview-content{flex:1;min-width:0}.overview-content strong{display:block;font-size:16px;line-height:24px;font-weight:500;letter-spacing:.15px}.overview-content small{display:block;font-size:14px;line-height:20px;color:var(--md-on-surface-variant);letter-spacing:.25px;margin-top:2px}.feature-overview::before{content:'';position:absolute;inset:0;background:currentColor;opacity:0;border-radius:inherit;pointer-events:none}.feature-overview:hover::before{opacity:.08}.feature-overview:active::before{opacity:.12}
.feature-panel{min-width:0;outline-offset:4px}.feature-panel>.hint:first-child{margin-top:0;margin-bottom:24px}.feature-panel>form{margin-bottom:24px}
.feature-field{position:relative;display:block;margin:20px 0 24px;font-weight:400;color:var(--md-on-surface-variant)}
.feature-field>label{position:absolute;left:12px;top:0;transform:translateY(-50%);max-width:calc(100% - 24px);padding:0 4px;background:var(--md-surface-container-low);color:var(--md-on-surface-variant);font-size:12px;line-height:16px;letter-spacing:.4px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;z-index:1}
.feature-field input,.feature-field select{display:block;width:100%;height:56px;min-height:56px;margin:0;padding:12px 16px;border:1px solid var(--md-outline);border-radius:4px;background-color:transparent;color:var(--md-on-surface);font-family:inherit;font-weight:400;font-size:16px;line-height:24px;letter-spacing:.5px}
.feature-field input[type="date"]{box-sizing:border-box;min-width:0;padding:0 16px;border-radius:4px;background:var(--md-surface-container-low);font:inherit;letter-spacing:.5px;line-height:normal;-webkit-appearance:auto;appearance:auto}
.feature-field input[type="date"]:focus{padding:0 15px;border:2px solid var(--md-primary)}
.feature-field input:hover,.feature-field select:hover{border-color:var(--md-on-surface)}.feature-field input:focus,.feature-field select:focus{outline:2px solid var(--md-primary);outline-offset:-2px;border-color:var(--md-primary)}.feature-field:focus-within>label{color:var(--md-primary)}.feature-field select{appearance:none;-webkit-appearance:none;padding-right:48px;background-image:linear-gradient(45deg,transparent 50%,var(--md-on-surface-variant) 50%),linear-gradient(135deg,var(--md-on-surface-variant) 50%,transparent 50%);background-position:calc(100% - 20px) 25px,calc(100% - 15px) 25px;background-size:5px 5px;background-repeat:no-repeat}.feature-field select option{background:var(--md-surface-container-low)}
.feature-field input[type="number"]{font-variant-numeric:tabular-nums}.feature-field input[type="number"]::-webkit-inner-spin-button{opacity:0}.feature-field input[type="number"]:focus::-webkit-inner-spin-button{opacity:1}
.feature-actions{display:flex;flex-wrap:wrap;align-items:center;gap:12px 8px;margin-top:16px;padding-block:4px}.feature-row{display:block;background:var(--md-surface-container);border-radius:12px;padding:16px;margin:12px 0;overflow-wrap:anywhere}.feature-row strong{font-size:16px;line-height:24px;font-weight:500;letter-spacing:.15px}.feature-row p{margin:4px 0;font-size:14px;line-height:20px;letter-spacing:.25px;color:var(--md-on-surface-variant)}.feature-row .feature-field>label{background:var(--md-surface-container)}
.feature-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:200px;padding:32px 24px;text-align:center;color:var(--md-on-surface-variant);font-size:14px;line-height:20px}.empty-symbol{display:grid;place-items:center;background:var(--md-surface-container-high);color:var(--md-primary);width:64px;height:64px;border-radius:20px;margin-bottom:16px}.empty-symbol svg{width:32px;height:32px}.feature-empty p{margin:0;max-width:280px}
.feature-budget{padding:0 0 24px;margin-bottom:24px;border-bottom:1px solid var(--md-outline-variant)}.feature-budget .feature-field{margin-bottom:16px}.feature-budget progress{display:block;width:100%;height:4px;accent-color:var(--md-primary);border:0;border-radius:2px;overflow:hidden}.feature-budget progress::-webkit-progress-bar{background:var(--md-surface-container-highest)}.feature-budget progress::-webkit-progress-value{background:var(--md-primary);border-radius:2px}.feature-budget .hint{margin:8px 0 0}.feature-budget.is-over progress::-webkit-progress-value{background:var(--md-error)}.feature-budget.is-over .hint{color:var(--md-error)}
.feature-history{background:var(--md-surface-container);border-radius:12px;margin:8px 0;padding:16px}.feature-history summary{cursor:pointer;min-height:48px;font-size:16px;line-height:24px;letter-spacing:.15px}.feature-history summary strong{font-weight:500}.feature-history summary>span{display:block;font-size:12px;line-height:16px;letter-spacing:.4px;color:var(--md-on-surface-variant);margin-top:4px;padding-left:16px}
.feature-diff{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-top:16px}.feature-diff>div{min-width:0}.feature-diff b{font-size:14px;font-weight:500;line-height:20px}.feature-description{margin:12px 0;display:grid;grid-template-columns:minmax(80px,.8fr) minmax(0,1.2fr);gap:8px 12px;font-size:14px;line-height:20px;letter-spacing:.25px;overflow-wrap:anywhere;user-select:text}.feature-description dt{color:var(--md-on-surface-variant)}.feature-description dd{margin:0;white-space:pre-wrap}.feature-diff ul{padding-left:20px;font-size:14px;line-height:20px}
.feature-conflict{border:1px solid var(--md-outline-variant);border-radius:12px;margin:24px 0;padding:16px}.feature-conflict legend{font-size:16px;line-height:24px;font-weight:500;padding-inline:8px}.feature-conflict .feature-diff{margin:0}.feature-conflict label{display:block;padding:12px;border-radius:8px;cursor:pointer;font-size:14px;line-height:20px}.feature-conflict input{accent-color:var(--md-primary);width:20px;height:20px;vertical-align:middle;margin:0 8px 0 0}.feature-conflict label:has(input:checked){background:var(--md-secondary-container);color:var(--md-on-secondary-container)}.feature-conflict label:has(input:focus-visible){outline:3px solid var(--md-primary);outline-offset:2px}.feature-conflict .feature-description{grid-template-columns:minmax(0,1fr);gap:4px}.feature-conflict dd{margin-bottom:8px}
.feature-check{display:flex;align-items:center;gap:16px;min-height:56px;margin:16px 0;font-size:16px;line-height:24px;letter-spacing:.5px;cursor:pointer}.feature-check input{width:20px;height:20px;accent-color:var(--md-primary);flex-shrink:0;margin:0}
.feature-receipt{display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:56px;padding:4px 0;border-bottom:1px solid var(--md-outline-variant);overflow-wrap:anywhere}.feature-receipt a{color:var(--md-primary);min-height:48px;display:flex;align-items:center;font-size:14px;line-height:20px}.feature-upload{position:relative}.feature-upload input{position:absolute;inset:-4px 0;opacity:0;cursor:pointer;width:100%;height:48px}.feature-upload:focus-within{outline:3px solid var(--md-primary);outline-offset:3px}
#expenseMetadata{margin-top:24px;border-top:1px solid var(--md-outline-variant);padding-top:8px}.feature-identity{margin:0 0 32px;padding-bottom:8px;border-bottom:1px solid var(--md-outline-variant)}.feature-identity .settings-section-title{margin-top:0}.feature-identity .hint{margin-bottom:16px}.feature-form-actions{position:sticky;bottom:-24px;background:var(--md-surface-container-low);padding:16px 0 24px;margin-top:8px;z-index:2;display:flex;justify-content:flex-end;border-top:1px solid var(--md-outline-variant)}
@media(max-width:480px){.feature-diff{grid-template-columns:minmax(0,1fr)}.feature-row .btn{padding-inline:16px}.feature-history{padding:16px 12px}}
@media(max-width:380px){.feature-overview{gap:12px;padding:12px}.overview-content small{font-size:12px;line-height:16px}.feature-description{grid-template-columns:minmax(72px,.8fr) minmax(0,1.2fr)}}
/* Management destinations share one hierarchy: title, supporting text, content, actions. */
.management-screen{padding-top:0}.management-intro{font-size:14px;line-height:20px;letter-spacing:.25px;color:var(--md-on-surface-variant);margin:0 0 24px;max-width:60ch}
.management-section-title{font-size:14px;line-height:20px;font-weight:500;letter-spacing:.1px;color:var(--md-on-surface-variant);margin:24px 0 16px}
.management-toolbar{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:48px;margin:-8px 0 16px;color:var(--md-on-surface-variant);font-size:14px;line-height:20px;letter-spacing:.25px}
.management-list{display:flex;flex-direction:column;gap:16px;margin:0 0 24px}.management-card{border:1px solid var(--md-outline-variant);border-radius:12px;background:var(--md-surface-container-low);padding:16px;margin:0;min-width:0}
.management-item-header{display:flex;align-items:center;gap:16px;min-height:48px}.management-item-copy{flex:1;min-width:0}.management-item-copy h3{font-size:16px;line-height:24px;font-weight:500;letter-spacing:.15px;margin:0;overflow-wrap:anywhere}.management-item-copy p{font-size:14px;line-height:20px;letter-spacing:.25px;margin:4px 0 0;color:var(--md-on-surface-variant)}
.management-symbol,.management-category{display:grid;place-items:center;width:40px;height:40px;flex:0 0 40px;border-radius:50%;background:var(--md-secondary-container);color:var(--md-on-secondary-container)}.management-symbol svg{width:24px;height:24px}.management-category{font-size:20px;background:var(--cat-tint,var(--md-secondary-container));color:var(--cat-fg,var(--md-on-secondary-container))}
.management-amount{font-size:20px!important;line-height:28px;font-weight:500;letter-spacing:0;font-variant-numeric:tabular-nums;white-space:nowrap}.management-card .feature-field{margin:24px 0 16px}.management-card .feature-field>label{background:var(--md-surface-container-low)}
.management-card .feature-actions{justify-content:flex-end;gap:12px 8px;margin:16px 0 0;padding:4px 0}.management-card .feature-actions .btn{flex:0 0 auto}.management-card .management-status{display:inline-block;margin:16px 0 0 56px;font-size:12px;line-height:16px;letter-spacing:.4px;color:var(--md-on-surface-variant)}.management-card .management-status.overdue{color:var(--md-error)}
.management-card.feature-budget{margin:0;padding:16px;border:1px solid var(--md-outline-variant)}.management-supporting{font-size:12px;line-height:16px;letter-spacing:.4px;color:var(--md-on-surface-variant);margin:8px 0 0}.management-card.is-over .management-supporting{color:var(--md-error)}
.management-shortcuts{display:flex;flex-wrap:wrap;gap:12px 8px;margin-bottom:24px;padding-block:4px}.management-save-view{margin-bottom:32px}.management-save-view .management-section-title{margin:0 0 24px;color:var(--md-on-surface)}.management-save-view form{margin:0}.management-save-view .feature-field{margin:0 0 16px}
.management-card.feature-history summary{position:relative;display:block;list-style:none;padding-right:32px;min-height:48px}.management-card.feature-history summary::-webkit-details-marker{display:none}.management-card.feature-history summary::after{content:'';position:absolute;right:6px;top:14px;width:9px;height:9px;border:solid var(--md-on-surface-variant);border-width:0 2px 2px 0;transform:rotate(45deg);transition:transform var(--dur-fast)}.management-card.feature-history[open] summary::after{transform:rotate(225deg)}.management-card.feature-history summary .management-history-title{font-size:16px;line-height:24px;letter-spacing:.15px;color:var(--md-on-surface);padding:0;margin:0;font-weight:500}.management-card.feature-history summary>span:last-child{padding-left:0;margin-top:4px}.management-card.feature-history .feature-diff{padding-top:16px;border-top:1px solid var(--md-outline-variant)}
/* Disclosure cards need their own row so opening one cannot stretch or clip its neighbor. */
.management-list:has(>.feature-history){grid-template-columns:minmax(0,1fr)!important;align-items:start}
#personNamesForm{margin:24px 0 32px}#personNamesForm .feature-actions{justify-content:flex-end}.management-form-error{font-size:12px;line-height:16px;color:var(--md-error);margin:8px 0 16px}
[data-person-name]{min-width:0;overflow:hidden;text-overflow:ellipsis}.seg [data-person-name]{white-space:nowrap}
@media(max-width:380px){.management-card{padding:16px 12px}.management-item-header{gap:12px}.management-amount{font-size:18px!important}.management-symbol,.management-category{width:36px;height:36px;flex-basis:36px}.management-card .management-status{margin-left:48px}.management-card .feature-actions .btn{padding-inline:12px}.management-toolbar{gap:8px}}
.feature-field input[aria-invalid="true"]{border-color:var(--md-error)}.feature-field:has(input[aria-invalid="true"])>label{color:var(--md-error)}.feature-field input[aria-invalid="true"]:focus{outline-color:var(--md-error)}
/* The other destinations in Gestione use the same outlined card and action row. */
.cat-list,.rec-list{gap:16px}.cat-item,.rec-item{background:var(--md-surface-container-low);border:1px solid var(--md-outline-variant);border-radius:12px;padding:16px;min-height:80px}.cat-item .cat-icon-big,.rec-icon{width:40px;height:40px;flex-basis:40px;font-size:20px}.cat-title,.rec-title{font-size:16px;line-height:24px;font-weight:500;letter-spacing:.15px}.cat-meta,.rec-meta{font-size:14px;line-height:20px;letter-spacing:.25px;color:var(--md-on-surface-variant)}
.rec-item{display:grid;grid-template-columns:40px minmax(0,1fr) auto;column-gap:16px;row-gap:16px}.rec-main{min-width:0}.rec-title{white-space:normal;overflow-wrap:anywhere}.rec-meta{white-space:normal;overflow-wrap:anywhere}.rec-amount{align-self:start;line-height:24px}.rec-actions{grid-column:1/-1;justify-self:end}.rec-item.paused{opacity:1}.rec-item.paused .rec-icon{background:var(--md-surface-container-high);color:var(--md-on-surface-variant)}
.management-tag{display:inline-block;margin-top:8px;padding:4px 8px;border-radius:8px;background:var(--md-secondary-container);color:var(--md-on-secondary-container);font-size:12px;line-height:16px;letter-spacing:.4px}.management-shortcuts .btn{max-width:100%;white-space:normal;height:auto;min-height:40px;line-height:20px;padding-block:10px}.dh-split>span,.sc-split>span{min-width:0;flex:1}.dh-split [data-person-name],.sc-split [data-person-name]{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.dh-split strong,.sc-split strong{display:block}
@media(max-width:380px){.rec-item,.cat-item{padding:16px 12px}.rec-item{column-gap:12px}.rec-amount{font-size:14px}}
.date-display{position:absolute;z-index:1;left:16px;right:44px;top:50%;transform:translateY(-50%);overflow:hidden;white-space:nowrap;text-overflow:ellipsis;pointer-events:none;color:var(--md-on-surface);font-family:inherit;font-size:16px;font-weight:400;line-height:24px;letter-spacing:.5px}.date-display.is-placeholder{color:var(--md-on-surface-variant);opacity:.72}.tf:has(> input[type="date"])>.date-display{left:16px;right:44px}.tf input[type="date"]::-webkit-datetime-edit{color:transparent;-webkit-text-fill-color:transparent}.feature-field input[type="date"]::-webkit-datetime-edit{color:transparent;-webkit-text-fill-color:transparent}
/* Keep the native picker interactive while drawing its value and icon consistently in the M3 field. */
.tf:has(> input[type="date"]),.feature-field:has(> input[type="date"]){position:relative;width:100%;min-width:0;height:56px}
.tf:has(> input[type="date"])>input[type="date"],.feature-field>input[type="date"]{position:absolute;inset:0;z-index:2;width:100%;max-width:100%;min-width:0;height:56px;opacity:0;padding:0;border:0;cursor:pointer}
.tf:has(> input[type="date"]):focus-within,.feature-field:has(> input[type="date"]):focus-within{outline:2px solid var(--md-primary);outline-offset:-2px;border-radius:4px}
.date-display{right:48px!important;left:16px!important;padding-right:4px}
.date-display::after{content:'';position:absolute;right:-30px;top:4px;width:16px;height:15px;border:1.7px solid currentColor;border-radius:3px;background:linear-gradient(currentColor,currentColor) 0 4px/100% 1.5px no-repeat,radial-gradient(circle,currentColor 1px,transparent 1.5px) 3px 8px/5px 5px,radial-gradient(circle,currentColor 1px,transparent 1.5px) 9px 8px/5px 5px;opacity:.72}
.tf:has(> input[type="date"]),.feature-field:has(> input[type="date"]){box-sizing:border-box;border:1px solid var(--md-outline);border-radius:4px;background:var(--md-surface-container-low)}
.tf:has(> input[type="date"]):focus-within,.feature-field:has(> input[type="date"]):focus-within{border:2px solid var(--md-primary);outline:0}