/* Budget adjustments and feedback follow the rose palette. */
html[data-theme=rose] .adjust{background:var(--theme-surface)!important;color:var(--theme-accent)!important;border-color:var(--theme-card)!important}
html[data-theme=rose] .adjust:hover{background:var(--theme-card)!important}
html[data-theme=rose] .badge{background:var(--theme-surface)!important;color:var(--theme-accent)!important}
html[data-theme=rose] :is(.allocation-message,.fixed-status,.chart-label,.status){color:var(--theme-accent)!important}
html[data-theme=rose] :is(.adjust:focus-visible,.ratio input:focus-visible){outline-color:var(--theme-accent)!important}
html[data-theme=rose] :is(.ratio input,#total){border-color:var(--theme-card)!important;color:var(--theme-accent)!important}
html[data-theme=rose] :is(.back,a[aria-label="設定"]){color:var(--theme-accent)!important}

.fixed-dialog .submit{background:var(--theme-accent,#76624F)!important;color:var(--theme-on-accent,#fff)!important}

.category-budget-input{display:flex;align-items:center;gap:7px;background:var(--theme-bg,#FAF7F0);border:1px solid var(--theme-card,#DCD0BA);border-radius:12px;padding:4px 10px;color:var(--theme-accent,#76624F)}.category-budget-input input[type=number]{width:110px;border:0;background:transparent;font-size:18px;padding:8px 0;color:inherit}.category-budget-input:focus-within{outline:2px solid var(--theme-accent,#76624F);outline-offset:2px}


/* Original category cards, with exact amount controls in the upper right. */
#cards .card{padding:14px;border-radius:15px;margin:10px 0;background:color-mix(in srgb,var(--color) 25%,var(--theme-bg,#FAF7F0))!important;border:0}
#cards .name{font-weight:400;min-width:0}#cards .dot{width:10px;height:10px;border-radius:50%;background:var(--color);flex-shrink:0}
#cards .category-budget-input{display:flex;align-items:center;gap:6px;width:auto;flex-shrink:0;padding:0;border:0;background:transparent;outline:none;color:var(--theme-accent,#76624F)}
#cards .category-budget-input input[type=number]{width:90px;font-size:16px;padding:9px 5px;background:var(--theme-bg,#FAF7F0);border:1px solid var(--theme-card,#DCD0BA);border-radius:9px;text-align:right;color:inherit}
#cards .category-budget-input button{width:30px;height:30px;padding:0;border-radius:8px;background:var(--theme-surface,#EDE7DD);color:var(--theme-accent,#76624F)}
#cards .percent{margin:5px 0 0;text-align:left;font-size:12px;color:#81786D}
#cards input[type=range]{appearance:none;-webkit-appearance:none;width:100%;height:20px;background:transparent;margin:14px 0 5px;padding:0;border:0;cursor:pointer}
#cards input[type=range]::-webkit-slider-runnable-track{height:5px;border-radius:10px;border:1px solid #fff;background:linear-gradient(to right,#76624F 0 var(--fill),#E2E3E3 var(--fill) 100%)}
#cards input[type=range]::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;width:24px;height:17px;margin-top:-7px;border-radius:10px;background:#fff;border:1px solid #E3DCD0;box-shadow:0 1px 3px #34312D15}
#cards input[type=range]::-moz-range-track{height:4px;border-radius:10px;background:#E2E3E3;border:1px solid #fff}#cards input[type=range]::-moz-range-progress{height:4px;background:#76624F}#cards input[type=range]::-moz-range-thumb{width:24px;height:17px;border-radius:10px;background:#fff;border:1px solid #E3DCD0;box-shadow:0 1px 3px #34312D15}
@media(max-width:350px){#cards .category-budget-input{gap:4px}#cards .category-budget-input input[type=number]{width:75px}#cards .category-budget-input button{width:25px}}

/* Option C: each control follows its category palette. */
#cards .category-budget-input{width:155px;padding:10px 14px;border:0;border-radius:20px;background:color-mix(in srgb,var(--color) 12%,var(--theme-bg,#FAF7F0));color:var(--theme-accent,#76624F);gap:8px}
#cards .category-budget-input input[type=number]{width:100%;min-width:0;padding:0;border:0;background:transparent;border-radius:0;font-size:20px;color:inherit}
#cards .category-budget-input:focus-within{outline:2px solid var(--color);outline-offset:2px}
#cards input[type=range]{height:28px;margin:15px 0 0}
#cards input[type=range]::-webkit-slider-runnable-track{height:10px;border:2px solid #ffffff88;border-radius:20px;background:linear-gradient(to right,var(--color) 0 var(--fill),color-mix(in srgb,var(--color) 12%,var(--theme-bg,#FAF7F0)) var(--fill) 100%)}
#cards input[type=range]::-webkit-slider-thumb{width:25px;height:18px;margin-top:-6px;border-radius:9px;background:var(--theme-bg,#FAF7F0);border:1px solid var(--color);box-shadow:0 1px 3px #34312D18}
#cards input[type=range]::-moz-range-track{height:6px;border:2px solid #ffffff88;border-radius:20px;background:color-mix(in srgb,var(--color) 12%,var(--theme-bg,#FAF7F0))}
#cards input[type=range]::-moz-range-progress{height:6px;border-radius:20px;background:var(--color)}
#cards input[type=range]::-moz-range-thumb{width:25px;height:18px;border-radius:9px;background:var(--theme-bg,#FAF7F0);border:1px solid var(--color);box-shadow:0 1px 3px #34312D18}
@media(max-width:350px){#cards .category-budget-input{width:135px}#cards .category-budget-input input[type=number]{width:100%}}

/* Match the approved C preview geometry and finishes. */
#cards .card{padding:18px;border-radius:18px}
#cards .row{gap:14px}
#cards .category-budget-input{width:155px;gap:7px;padding:10px 14px;border:0;border-radius:20px;background:color-mix(in srgb,var(--theme-bg,#FAF7F0) 80%,transparent)}
#cards .category-budget-input span{font-size:13px}
#cards .category-budget-input input[type=number]{font-size:20px}
#cards .category-budget-input:focus-within{outline:2px solid var(--theme-accent,#76624F);outline-offset:2px}
#cards input[type=range]::-webkit-slider-runnable-track{height:10px;border:2px solid #ffffff88;background:linear-gradient(to right,color-mix(in srgb,var(--theme-accent,#76624F) 65%,var(--color)) 0 var(--fill),#FFFFFF99 var(--fill) 100%)}
#cards input[type=range]::-webkit-slider-thumb{width:25px;height:18px;margin-top:-6px;border-radius:9px;background:var(--theme-bg,#FAF7F0);border:1px solid var(--theme-card,#DCD0BA);box-shadow:0 1px 3px #34312D18}
#cards input[type=range]::-moz-range-track{background:#FFFFFF99}
#cards input[type=range]::-moz-range-progress{background:color-mix(in srgb,var(--theme-accent,#76624F) 65%,var(--color))}
#cards input[type=range]::-moz-range-thumb{border-color:var(--theme-card,#DCD0BA)}
#cards .percent{margin-top:7px}
@media(max-width:350px){#cards .category-budget-input{width:135px}}

#cards .category-budget-input,#cards .category-budget-input input[type=number]{background:transparent!important;border:0!important;box-shadow:none!important}#cards .category-budget-input:focus-within{outline:none}#cards .category-budget-input input[type=number]:focus-visible{outline:2px solid var(--color);outline-offset:4px;border-radius:5px}

#cards .category-budget-input{background:color-mix(in srgb,var(--theme-bg,#FAF7F0) 80%,transparent)!important;border:1px solid color-mix(in srgb,var(--color) 35%,var(--theme-bg,#FAF7F0))!important;border-radius:20px;box-shadow:none!important}#cards .category-budget-input input[type=number]{background:transparent!important;border:0!important;box-shadow:none!important;outline:none!important}#cards .category-budget-input:focus-within{outline:2px solid var(--color);outline-offset:2px}

#cards input[type=range]::-webkit-slider-runnable-track{border:0}#cards input[type=range]::-webkit-slider-thumb{margin-top:-4px}#cards input[type=range]::-moz-range-track{border:0;height:10px}#cards input[type=range]::-moz-range-progress{height:10px}

html[data-theme] #cards input[type=range]{background:transparent!important;background-color:transparent!important;border:0!important;box-shadow:none!important}

#form>.monthly-budget-editor{margin:0 0 22px}
/* Monthly budget editor */
#form>.monthly-budget-editor{padding:20px;border-radius:22px;background:var(--theme-surface,#EDE7DD)!important;border:1px solid var(--theme-card,#DCD0BA)}
#form>.monthly-budget-editor>label{display:block;margin:0 0 13px;font-size:13px;font-weight:500;color:var(--theme-accent,#76624F)}
#form>.monthly-budget-editor .monthly-budget-input{display:flex;align-items:center;gap:11px;padding:13px 16px;border-radius:15px;background:var(--theme-bg,#FAF7F0)!important;border:1px solid var(--theme-card,#DCD0BA)}
#form>.monthly-budget-editor .monthly-budget-input>span{font-size:21px;color:var(--theme-accent,#76624F)}
#form>.monthly-budget-editor #total{flex:1;min-width:0;width:100%;margin:0;padding:0;background:transparent!important;border:0!important;border-radius:0;box-shadow:none!important;outline:none;font-size:30px;font-weight:500;color:var(--theme-accent,#76624F)!important;text-align:left}
#form>.monthly-budget-editor .monthly-budget-input>small{flex-shrink:0;font-size:11px;color:var(--theme-accent,#76624F);white-space:nowrap}
#form>.monthly-budget-editor .monthly-budget-input:focus-within{outline:2px solid var(--theme-accent,#76624F);outline-offset:2px}

/* Selected compact total-budget card C. */
#form>.monthly-budget-editor{width:280px;max-width:100%;margin:0 auto 22px;padding:0;overflow:hidden;border:1px solid var(--theme-card,#DCD0BA);border-radius:18px;background:transparent!important}
#form>.monthly-budget-editor>label{display:flex;align-items:center;gap:10px;padding:10px 14px;margin:0;font-size:12px;background:var(--theme-surface,#EDE7DD)}
.total-budget-icon{width:24px;height:24px;display:grid;place-items:center;border-radius:9px;background:var(--theme-card,#DCD0BA)}.total-budget-icon svg{width:19px;height:19px}
#form>.monthly-budget-editor .monthly-budget-input{margin:12px 14px;padding:3px 0;background:transparent!important;border:0;border-radius:0;gap:9px}
#form>.monthly-budget-editor #total{font-size:26px}#form>.monthly-budget-editor .monthly-budget-input>span{font-size:18px}#form>.monthly-budget-editor .monthly-budget-input>small{font-size:10px}
.total-budget-hint{font-size:10px;color:#81786D;padding:0 14px 12px;margin:0}

/* Approved overall design B. */
#form>.monthly-budget-editor{width:100%;border:0;border-radius:0;background:transparent!important;margin-bottom:5px}#form>.monthly-budget-editor>label{background:transparent;padding:0;color:var(--theme-accent)}#form>.monthly-budget-editor .monthly-budget-input{margin:10px 0;padding:7px 0 12px;border-bottom:1px solid var(--theme-card);justify-content:flex-start}#form>.monthly-budget-editor #total{font-size:34px}.total-budget-hint{padding:0}#form .chart{width:200px;height:200px;margin:20px auto}#form .center{inset:30px}#cards .card{background:transparent!important;border-bottom:1px solid var(--theme-card);border-radius:0;padding:18px 0;margin:0}#cards .category-budget-input{background:var(--theme-surface)!important}.primary{border-radius:18px}

.phone header a[aria-label="設定"]{background:var(--theme-surface,#EDE7DD)!important;color:var(--theme-accent,#76624F)!important}.phone header a[aria-label="設定"] svg circle{fill:var(--theme-surface,#EDE7DD)!important}

#personal-budget-content>#chart{width:250px;height:250px;margin:18px auto}#personal-budget-content>#chart>.center{inset:27%;background:var(--theme-bg,#FAF7F0)!important}#personal-budget-content #ring{width:100%;height:100%}
