/* Gerado por tools/escopo-previa.py a partir do CSS da prévia aprovada. Não edite à mão: edite web/previa-extra.css. */
.ui { font-family: var(--sans); color: var(--ink); }
.ui { --ink:#1F2D4A; --muted:#5E6270; --faint:#7C8089; --line:#ECE6DA; --gold:#7A5A22; --goldbar:#B8893A; --goldbg:#F6F0E4; --soft:#FAF8F4; --panel:#FFFFFF; --need:#B8452E; --needbg:#FBEAE6; --vera:#4E618C; --verabg:#EEF1F6; --ok:#2A7552; --okbg:#E1F0E8; --warn:#A8580A; --warnbg:#FBEBD3; --btn:#1F2D4A; --btnink:#FFFFFF; --out:#1F2D4A; --outink:#FFFFFF; --pagebg:#F7F3EA;
  --edgeInk:#1F2D4A; --edgeMuted:#5E6270; --glass:rgba(255,255,255,.5); --glassLine:rgba(255,255,255,.65); --chipbg:rgba(255,255,255,.78);
  --sans:'Jost',system-ui,sans-serif; --serif:'Cormorant Garamond','Times New Roman',serif}
:root[data-tema="escuro"] .ui { --ink:#ECE8E0; --muted:#A5ABB8; --faint:#8A91A1; --line:#2B3243; --gold:#E2C287; --goldbar:#B8893A; --goldbg:rgba(184,137,58,.17); --soft:#141925; --panel:#1A2030; --need:#F0A493; --needbg:rgba(200,85,61,.2); --vera:#BCC8E6; --verabg:rgba(91,110,154,.28); --ok:#6FCF9F; --okbg:#1E3329; --warn:#F2B15C; --warnbg:#3A2C17; --btn:#E2C287; --btnink:#141925; --out:#34446A; --outink:#ECE8E0; --pagebg:#0F131C;
  --edgeInk:#ECE8E0; --edgeMuted:rgba(236,232,224,.7); --glass:rgba(18,23,34,.6); --glassLine:rgba(255,255,255,.09); --chipbg:rgba(255,255,255,.08)}
@keyframes breathe { 0%, 100% { scale: 1; } 50% { scale: 1.035; } }
@keyframes drift { from { transform: translateX(-35vw); } to { transform: translateX(135vw); } }
@keyframes fall { to { transform: translate3d(-40px, 124vh, 0); } }
@keyframes twinkle { 50% { opacity: .95; } }
@keyframes fogmove { from { transform: translateX(-8vw); } to { transform: translateX(8vw); } }
@keyframes cardin { from { opacity: 0; transform: translateY(16px) scale(.985); } to { opacity: 1; transform: none; } }
@keyframes arm { from { opacity: 0; transform: translateY(-22px); } to { opacity: 1; transform: none; } }
@keyframes fadein { from { opacity: 0; } to { opacity: 1; } }
.ui .av {width: 38px; height: 38px; border-radius: 50%; display: grid; place-items: center; font-weight: 600; font-size: 12.5px; flex: none; background: var(--goldbg); color: var(--gold); overflow: hidden;}
.ui .kp {display: flex; align-items: center; gap: 8px; height: 34px; padding: 0 12px; border-radius: 999px; background: var(--chipbg); color: var(--ink); font-size: 12px; white-space: nowrap;}
.ui .kp b {font-size: 14px;}
.ui .kp.alert b {color: var(--need);}
.ui .work {overflow-y: auto; overflow-x: hidden; padding: 14px; min-height: 0; -webkit-overflow-scrolling: touch;}
.ui .screen {display: grid; gap: 14px; max-width: 1180px; margin: 0 auto; align-content: start;}
.ui .cols {display: grid; gap: 14px; grid-template-columns: repeat(auto-fit, minmax(min(100%, 320px), 1fr)); align-items: start;}
.ui .panel {background: var(--panel); border: 1px solid var(--line); border-radius: 20px; padding: 16px; box-shadow: 0 6px 24px rgba(31,45,74,.05); min-width: 0; display: grid; gap: 12px; align-content: start;}
:root[data-tema="escuro"] .ui .panel {box-shadow: 0 6px 24px rgba(0,0,0,.25);}
:root[data-estilo="classico"] .ui .panel {box-shadow: none;}
.ui .panel h3 {margin: 0; font-size: 16px; font-weight: 600;}
.ui .panel h3 small {font-weight: 400; color: var(--muted); font-size: 12px; margin-left: 6px;}
.ui .lab {font-size: 11px; letter-spacing: .12em; text-transform: uppercase; color: var(--faint); font-weight: 600;}
.ui .mut {color: var(--muted);}
.ui .num {font-weight: 500; font-variant-numeric: tabular-nums;}
.ui .kpis {display: grid; gap: 10px; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));}
.ui .k {background: var(--panel); border: 1px solid var(--line); border-radius: 16px; padding: 12px 14px; display: grid; gap: 2px;}
.ui .k b {font-size: 26px; font-weight: 500; line-height: 1.1;}
.ui .k span {font-size: 12px; color: var(--muted);}
.ui .chip {display: inline-flex; align-items: center; height: 26px; padding: 0 11px; border-radius: 999px; border: 1px solid var(--line); background: transparent; font-size: 12px; color: var(--muted); white-space: nowrap; gap: 6px;}
.ui .chip.on {background: var(--btn); color: var(--btnink); border-color: var(--btn);}
.ui .tag {font-size: 11px; font-weight: 600; padding: 2px 9px; border-radius: 999px; background: var(--soft); color: var(--muted); white-space: nowrap; display: inline-block;}
.ui .tag.need {background: var(--needbg); color: var(--need);}
.ui .tag.vera {background: var(--verabg); color: var(--vera);}
.ui .tag.gold {background: var(--goldbg); color: var(--gold);}
.ui .tag.ok {background: var(--okbg); color: var(--ok);}
.ui .tag.warn {background: var(--warnbg); color: var(--warn);}
.ui .chips {display: flex; gap: 6px; flex-wrap: wrap;}
.ui .btn {height: 40px; padding: 0 18px; border: 0; border-radius: 12px; background: var(--btn); color: var(--btnink); font-weight: 600; font-size: 13.5px;}
.ui .btn.ghost {background: transparent; color: var(--ink); border: 1px solid var(--line);}
.ui .btn.sm {height: 34px; padding: 0 14px; font-size: 12.5px;}
.ui .btn[disabled] {opacity: .45; cursor: default;}
.ui .row {display: flex; gap: 11px; padding: 11px 8px; border-radius: 14px; align-items: center; width: 100%; background: transparent; border: 0; text-align: left;}
.ui .row:hover, .ui .row.sel {background: var(--goldbg);}
.ui .row .meta {flex: 1; min-width: 0; display: grid; gap: 3px;}
.ui .row .meta b {font-size: 14px; font-weight: 600;}
.ui .row .meta span.t {font-size: 12.5px; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.ui .row .side {display: grid; justify-items: end; gap: 4px; font-size: 12px; color: var(--muted);}
.ui .tm {font-weight: 600; font-size: 14px; font-variant-numeric: tabular-nums;}
.ui .search {height: 42px; border-radius: 12px; border: 1px solid var(--line); background: var(--soft); padding: 0 14px; width: 100%;}
.ui .alert {display: flex; gap: 10px; padding: 11px 13px; border-radius: 14px; background: var(--soft); border: 1px solid var(--line); width: 100%; text-align: left;}
.ui .alert i {width: 8px; height: 8px; border-radius: 50%; margin-top: 6px; flex: none;}
.ui .bar {height: 8px; border-radius: 99px; background: var(--soft); overflow: hidden;}
.ui .bar > div {height: 100%; border-radius: 99px; background: var(--goldbar);}
.ui .kv {display: flex; justify-content: space-between; gap: 12px; align-items: baseline;}
.ui .kv span {color: var(--muted); font-size: 13px;}
.ui .kv b {font-weight: 500; text-align: right;}
.ui .tabs {display: flex; gap: 6px;}
.ui .seg {display: inline-flex; padding: 3px; border-radius: 12px; background: var(--soft); border: 1px solid var(--line);}
.ui .seg button {border: 0; background: transparent; height: 32px; padding: 0 14px; border-radius: 9px; font-size: 13px; color: var(--muted);}
.ui .seg button.on {background: var(--panel); color: var(--ink); font-weight: 600; box-shadow: 0 1px 4px rgba(0,0,0,.08);}
.ui .chatgrid {display: grid; gap: 14px; grid-template-columns: 330px minmax(0,1fr) 320px; align-items: start;}
.ui .msgs {display: flex; flex-direction: column; gap: 9px; padding: 14px; background: var(--soft); border-radius: 16px; max-height: 52vh; overflow-y: auto;}
.ui .b {max-width: 82%; padding: 9px 12px; border-radius: 16px; font-size: 14px; line-height: 1.45;}
.ui .b small {display: block; font-size: 11px; opacity: .65; margin-top: 3px;}
.ui .b.in {background: var(--panel); border: 1px solid var(--line); align-self: flex-start; border-bottom-left-radius: 6px;}
.ui .b.out {background: var(--out); color: var(--outink); align-self: flex-end; border-bottom-right-radius: 6px;}
.ui .sys {align-self: center; font-size: 12px; padding: 4px 12px; border-radius: 999px; background: var(--warnbg); color: var(--warn); text-align: center;}
.ui .sug {padding: 12px; border-radius: 14px; background: var(--goldbg); border: 1px solid rgba(184,137,58,.35); display: grid; gap: 8px; font-size: 13.5px;}
.ui .compose {display: flex; gap: 8px;}
.ui .compose input {flex: 1; height: 42px; border-radius: 12px; border: 1px solid var(--line); background: var(--soft); padding: 0 12px; min-width: 0;}
.ui .qa {display: grid; gap: 2px; padding: 9px 12px; border-radius: 12px; background: var(--soft);}
.ui .qa span {font-size: 12px; color: var(--muted);}
.ui .qa b {font-size: 13.5px; font-weight: 500;}
.ui .next {padding: 11px 12px; border-radius: 14px; border: 1px solid rgba(184,137,58,.4); background: var(--goldbg); font-size: 13.5px;}
.ui .next b {display: block; color: var(--gold); font-size: 11px; letter-spacing: .1em; text-transform: uppercase; margin-bottom: 3px;}
.ui .kanban {display: grid; grid-auto-flow: column; grid-auto-columns: minmax(210px, 1fr); gap: 12px; overflow-x: auto; padding-bottom: 6px; scroll-snap-type: x proximity;}
.ui .col {background: var(--soft); border: 1px solid var(--line); border-radius: 16px; padding: 10px; display: grid; gap: 8px; align-content: start; scroll-snap-align: start;}
.ui .col h4 {margin: 2px 4px; font-size: 14px; display: flex; justify-content: space-between; align-items: center;}
.ui .lead {background: var(--panel); border: 1px solid var(--line); border-radius: 12px; padding: 10px 12px; display: grid; gap: 5px; text-align: left; width: 100%;}
.ui .days {display: grid; gap: 10px; grid-template-columns: repeat(auto-fit, minmax(min(100%, 210px), 1fr));}
.ui .day {background: var(--soft); border: 1px solid var(--line); border-radius: 16px; padding: 10px; display: grid; gap: 7px; align-content: start;}
.ui .day h4 {margin: 2px 4px 4px; font-size: 14px; display: flex; justify-content: space-between;}
.ui .ev {border-radius: 11px; padding: 8px 10px; background: var(--panel); border: 1px solid var(--line); font-size: 13px; display: grid; gap: 2px;}
.ui .ev b {font-weight: 600;}
.ui .ev span {color: var(--muted); font-size: 12px;}
.ui .ev.aus {background: var(--warnbg); border-color: transparent;}
.ui .ev.fer {background: var(--verabg); border-color: transparent;}
.ui .ev.busy {background: repeating-linear-gradient(135deg, var(--soft), var(--soft) 6px, var(--line) 6px, var(--line) 7px);}
.ui .fld {display: grid; gap: 6px;}
.ui .fld > span {font-size: 12px; font-weight: 600; color: var(--muted);}
.ui .fld input, .ui .fld textarea, .ui .fld select {border-radius: 12px; border: 1px solid var(--line); background: var(--soft); padding: 10px 12px; min-height: 42px; width: 100%;}
.ui .sw {display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 8px 0; font-size: 13.5px;}
.ui .sw button {width: 46px; height: 28px; border-radius: 99px; border: 0; background: var(--line); position: relative; flex: none;}
.ui .sw button::after {content: ''; position: absolute; top: 3px; left: 3px; width: 22px; height: 22px; border-radius: 50%; background: #fff; transition: transform .2s;}
.ui .sw button[aria-pressed="true"] {background: var(--goldbar);}
.ui .sw button[aria-pressed="true"]::after {transform: translateX(18px);}
.ui .chk {display: flex; gap: 10px; align-items: flex-start; padding: 9px 0; border-bottom: 1px solid var(--line); width: 100%; background: transparent; border-left: 0; border-right: 0; border-top: 0; text-align: left; font-size: 13.5px;}
.ui .chk i {width: 20px; height: 20px; border-radius: 6px; border: 1.5px solid var(--faint); flex: none; display: grid; place-items: center; font-style: normal; font-size: 13px; line-height: 1;}
.ui .chk[aria-pressed="true"] i {background: var(--ok); border-color: var(--ok); color: #fff;}
.ui .tbl {width: 100%; border-collapse: collapse; font-size: 13px;}
.ui .tbl th {text-align: left; font-size: 11px; letter-spacing: .1em; text-transform: uppercase; color: var(--faint); padding: 6px 8px; font-weight: 600;}
.ui .tbl td {padding: 10px 8px; border-top: 1px solid var(--line); white-space: nowrap;}
.ui .tbl .r {text-align: right;}
.ui .scroll-x {overflow-x: auto;}
.ui .opt {display: grid; gap: 8px; grid-template-columns: repeat(3, minmax(0,1fr));}
.ui .opt button {padding: 12px 6px; border-radius: 14px; border: 1px solid var(--line); background: var(--soft); display: grid; gap: 6px; justify-items: center; font-size: 12.5px; color: var(--muted);}
.ui .opt button[aria-pressed="true"] {border-color: var(--goldbar); background: var(--goldbg); color: var(--ink); font-weight: 600;}
.ui .swatch {width: 100%; height: 34px; border-radius: 9px; border: 1px solid var(--line);}
.ui .menu {display: grid; gap: 4px;}
.ui .menu button {display: flex; align-items: center; gap: 12px; padding: 12px; border-radius: 14px; border: 0; background: transparent; text-align: left; font-size: 15px;}
.ui .menu button:hover {background: var(--goldbg);}
.ui .menu svg {width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; color: var(--muted);}
.ui .bell {position: relative; width: 38px; height: 38px; border-radius: 50%; border: 0; background: var(--chipbg); color: var(--edgeInk); display: grid; place-items: center; flex: none; padding: 0;}
.ui .bell svg, .ui .ic svg {width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round;}
.ui .bell em {position: absolute; top: 3px; right: 2px; min-width: 16px; height: 16px; border-radius: 99px; background: var(--need); color: #fff; font-size: 10px; font-style: normal; font-weight: 700; display: grid; place-items: center; padding: 0 4px;}
.ui .hero {background: var(--panel); border: 1px solid var(--line); border-radius: 24px; padding: 20px; display: grid; gap: 14px; min-width: 0;}
.ui .hero h2 {margin: 0; font-family: var(--serif); font-weight: 400; font-size: clamp(32px, 7vw, 46px); line-height: 1.04; text-wrap: balance;}
.ui .note {display: flex; gap: 14px; align-items: flex-start; padding: 14px 16px; border-radius: 18px; background: var(--goldbg);}
.ui .note .em {font-size: 34px; line-height: 1; flex: none;}
.ui .note p {margin: 0; font-size: 15px; line-height: 1.5;}
.ui .wk {display: flex; gap: 6px; flex-wrap: wrap;}
.ui .wk button {border: 1px solid var(--line); background: var(--soft); border-radius: 12px; padding: 5px 9px; font-size: 12px; color: var(--muted); display: flex; gap: 6px; align-items: center;}
.ui .wk button span {font-size: 16px;}
.ui .wk button.on {border-color: var(--goldbar); color: var(--ink); background: var(--goldbg);}
.ui .moods {display: grid; grid-template-columns: repeat(5, minmax(0,1fr)); gap: 6px;}
.ui .moods button {border: 1px solid var(--line); background: var(--soft); border-radius: 16px; padding: 10px 2px 8px; display: grid; justify-items: center; gap: 5px; font-size: 11.5px; color: var(--muted); min-width: 0;}
.ui .moods button span {font-size: 26px; line-height: 1;}
.ui .moods button[aria-pressed="true"] {border-color: var(--goldbar); background: var(--goldbg); color: var(--ink); font-weight: 600;}
.ui .reply {padding: 12px 14px; border-radius: 14px; background: var(--soft); font-size: 13.5px; line-height: 1.5;}
.ui .ring {width: 116px; height: 116px; border-radius: 50%; background: conic-gradient(var(--goldbar) calc(var(--p) * 1%), var(--soft) 0); display: grid; place-items: center; flex: none; transition: background .4s;}
.ui .ring > div {width: 90px; height: 90px; border-radius: 50%; background: var(--panel); display: grid; place-content: center; text-align: center; gap: 2px;}
.ui .ring b {font-size: 30px; font-weight: 500; line-height: 1; font-variant-numeric: tabular-nums;}
.ui .ring span {font-size: 11px; color: var(--muted);}
.ui .hscroll {display: grid; grid-auto-flow: column; grid-auto-columns: minmax(250px, 1fr); gap: 10px; overflow-x: auto; scroll-snap-type: x mandatory; padding-bottom: 4px;}
.ui .story {scroll-snap-align: start; border-radius: 18px; border: 1px solid var(--line); background: var(--soft); padding: 14px; display: grid; gap: 8px; align-content: start; min-width: 0;}
.ui .story .ph {aspect-ratio: 16 / 7; max-width: 100%; border-radius: 12px; background: linear-gradient(160deg, var(--goldbg), var(--verabg)); display: grid; place-items: center; font-size: 30px;}
.ui .story ol {margin: 0; padding-left: 18px; display: grid; gap: 4px; font-size: 13px; color: var(--muted); line-height: 1.4;}
.ui .story.done {opacity: .62;}
.ui .tl .it {display: grid; grid-template-columns: 46px minmax(0,1fr) auto; gap: 12px; align-items: center; padding: 10px 0; border-top: 1px solid var(--line);}
.ui .tl .it:first-child {border-top: 0;}
.ui .tl .it > div:nth-child(2) {display: grid; gap: 3px; min-width: 0;}
.ui .tl .it small {color: var(--muted); font-size: 12px;}
.ui .dt {display: grid; justify-items: center; line-height: 1.05;}
.ui .dt b {font-size: 21px; font-weight: 500; font-variant-numeric: tabular-nums;}
.ui .dt span {font-size: 10px; letter-spacing: .12em; text-transform: uppercase; color: var(--faint);}
.ui .mgrid {display: grid; grid-template-columns: repeat(7, minmax(0,1fr)); gap: 4px;}
.ui .mgrid .wd {font-size: 10.5px; letter-spacing: .06em; text-transform: uppercase; color: var(--faint); text-align: center; padding: 2px 0; font-weight: 600;}
.ui .mc {border-radius: 10px; min-height: 66px; padding: 6px; background: var(--soft); border: 1px solid var(--line); display: grid; align-content: space-between; gap: 3px; text-align: left; font-size: 12px; color: var(--ink); min-width: 0;}
.ui .mc .d {font-weight: 600; font-variant-numeric: tabular-nums;}
.ui .mc small {font-size: 10.5px; color: var(--muted); line-height: 1.15; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.ui .mc.sm {min-height: 44px;}
.ui .mc.out {visibility: hidden;}
.ui .mc.we {opacity: .5;}
.ui .mc.fer {background: var(--verabg); border-color: transparent;}
.ui .mc.fer small {color: var(--vera);}
.ui .mc.aus {background: repeating-linear-gradient(135deg, var(--warnbg), var(--warnbg) 6px, transparent 6px, transparent 10px); border-color: var(--warnbg);}
.ui .mc.aus small {color: var(--warn);}
.ui .mc.full small {color: var(--need); font-weight: 600;}
.ui .mc.today {box-shadow: inset 0 0 0 2px var(--goldbar);}
.ui .mc.sel {background: var(--goldbg); border-color: var(--goldbar);}
.ui .occ {height: 5px; border-radius: 99px; background: var(--line); overflow: hidden;}
.ui .occ > i {display: block; height: 100%; background: var(--goldbar); border-radius: 99px;}
.ui .dots {display: flex; gap: 3px; flex-wrap: wrap; min-height: 7px;}
.ui .dots i {width: 7px; height: 7px; border-radius: 50%; display: block;}
.ui .lg {display: flex; gap: 12px; flex-wrap: wrap; font-size: 12px; color: var(--muted); align-items: center;}
.ui .lg i {width: 12px; height: 12px; border-radius: 4px; display: inline-block; vertical-align: -2px; margin-right: 5px; border: 1px solid var(--line);}
.ui .ygrid {display: grid; gap: 12px; grid-template-columns: repeat(auto-fill, minmax(min(100%, 150px), 1fr));}
.ui .ym {border: 1px solid var(--line); border-radius: 16px; padding: 10px 12px 12px; background: var(--panel); display: grid; gap: 8px; text-align: left; width: 100%; min-width: 0;}
.ui .ym h4 {margin: 0; font-size: 14px; font-weight: 600; display: flex; justify-content: space-between; align-items: baseline; gap: 6px;}
.ui .yg {display: grid; grid-template-columns: repeat(7, minmax(0,1fr)); gap: 3px;}
.ui .yg i {aspect-ratio: 1; border-radius: 4px; background: var(--soft); display: block;}
.ui .yg i.x {visibility: hidden;}
.ui .yg i.we {opacity: .35;}
.ui .yg i.fe {background: var(--vera); opacity: .55;}
.ui .yg i.au {background: var(--warn); opacity: .6;}
.ui .yg i.td {box-shadow: 0 0 0 1.5px var(--ink);}
.ui .h1 {background: rgba(184,137,58,.22) !important;}
.ui .h2 {background: rgba(184,137,58,.45) !important;}
.ui .h3 {background: rgba(184,137,58,.72) !important;}
.ui .h4 {background: #B8893A !important;}
.ui .split {display: grid; gap: 14px; grid-template-columns: minmax(0,1fr) 340px; align-items: start;}
.ui .fn {display: grid; gap: 9px;}
.ui .fn .s {display: grid; grid-template-columns: minmax(0,170px) minmax(0,1fr) 92px; gap: 10px; align-items: center; font-size: 13px;}
.ui .fn .s > div {height: 24px; border-radius: 8px; background: var(--soft); overflow: hidden;}
.ui .fn .s > div i {display: block; height: 100%; background: linear-gradient(90deg, var(--goldbar), rgba(184,137,58,.5)); border-radius: 8px;}
.ui .fn .s b {font-weight: 500; text-align: right; font-variant-numeric: tabular-nums;}
.ui .fn .s b small {display: block; color: var(--muted); font-size: 11px; font-weight: 400;}
.ui .tbl tr[data-a] {cursor: pointer;}
.ui .tbl tr.sel td {background: var(--goldbg);}
.ui .tiles {display: grid; gap: 8px; grid-template-columns: repeat(auto-fill, minmax(min(100%, 120px), 1fr));}
.ui .tile {aspect-ratio: 4 / 5; max-width: 100%; border-radius: 14px; background: linear-gradient(165deg, var(--goldbg), var(--soft) 60%, var(--verabg)); border: 1px solid var(--line); display: grid; align-content: end; padding: 8px; gap: 6px; font-size: 12px; color: var(--muted);}
.ui .steps {display: grid; gap: 0;}
.ui .steps .st {display: flex; gap: 12px; align-items: center; padding: 10px 0; border-top: 1px solid var(--line); font-size: 14px;}
.ui .steps .st:first-child {border-top: 0;}
.ui .steps .st i {width: 26px; height: 26px; border-radius: 50%; background: var(--okbg); color: var(--ok); display: grid; place-items: center; font-style: normal; font-weight: 700; font-size: 13px; flex: none;}
.ui .actions {display: flex; gap: 8px; flex-wrap: wrap;}
.ui { --gA: #F7DDB4; --gB: #EDB283; --gC: #D9A3A8; --gInk: #2A2233; --deep: #1F2D4A; --deepInk: #F4F1EA; --deepMut: rgba(244,241,234,.66); --deepCard: #FFFFFF; --deepCardInk: #1F2D4A}
:root[data-tema="escuro"] .ui { --gA: #5C4627; --gB: #6E4434; --gC: #4A3550; --gInk: #F6EFE4; --deep: #0B0F17; --deepInk: #ECE8E0; --deepMut: rgba(236,232,224,.6); --deepCard: #1A2030; --deepCardInk: #ECE8E0}
.ui .big {margin: 0; font-family: var(--serif); font-weight: 400; font-size: clamp(40px, 10vw, 60px); line-height: .98; letter-spacing: .005em;}
.ui .wstrip {display: grid; grid-template-columns: repeat(7, minmax(0,1fr)); gap: 4px;}
.ui .wstrip button {border: 0; background: transparent; border-radius: 999px; padding: 9px 0 8px; display: grid; justify-items: center; gap: 3px; color: var(--muted); font-size: 10px; text-transform: uppercase; letter-spacing: .08em; font-weight: 600; min-width: 0;}
.ui .wstrip b {font-size: 19px; color: var(--ink); font-weight: 500; letter-spacing: 0; font-variant-numeric: tabular-nums;}
.ui .wstrip button.on {background: var(--btn); color: var(--btnink);}
.ui .wstrip button.on b {color: var(--btnink);}
.ui .wstrip button i {width: 5px; height: 5px; border-radius: 50%; background: var(--goldbar);}
.ui .wstrip button i.no {background: transparent;}
.ui .gcard {border-radius: 26px; padding: 18px 18px 20px; background: linear-gradient(125deg, var(--gA) 0%, var(--gB) 55%, var(--gC) 100%); color: var(--gInk); display: flex; gap: 16px; align-items: center; justify-content: space-between; position: relative; overflow: hidden;}
.ui .gcard::after {content: ''; position: absolute; right: -60px; top: -80px; width: 220px; height: 220px; border-radius: 50%; background: radial-gradient(circle, rgba(255,255,255,.45), transparent 65%); pointer-events: none;}
.ui .gcard .lab {color: inherit; opacity: .7;}
.ui .gcard .pct {font-family: var(--serif); font-size: clamp(54px, 13vw, 76px); line-height: .9; font-weight: 400;}
.ui .gcard .ring {background: conic-gradient(var(--gInk) calc(var(--p) * 1%), rgba(255,255,255,.35) 0); position: relative; z-index: 1;}
.ui .gcard .ring > div {background: rgba(255,255,255,.55); color: var(--gInk);}
.ui .gcard .ring span {color: inherit; opacity: .7;}
:root[data-tema="escuro"] .ui .gcard .ring > div {background: rgba(0,0,0,.25);}
.ui .tline {display: grid; gap: 10px;}
.ui .tline .it {display: grid; grid-template-columns: 50px 14px minmax(0,1fr); gap: 8px;}
.ui .tline .when {font-size: 13px; font-weight: 600; padding-top: 13px; font-variant-numeric: tabular-nums;}
.ui .tline .when small {display: block; font-weight: 400; color: var(--faint); font-size: 11px; margin-top: 2px;}
.ui .tline .rl {position: relative;}
.ui .tline .rl::before {content: ''; position: absolute; left: 6px; top: 0; bottom: -10px; width: 1.5px; background: var(--line);}
.ui .tline .rl::after {content: ''; position: absolute; left: 1.5px; top: 16px; width: 10px; height: 10px; border-radius: 50%; border: 1.5px solid var(--goldbar); background: var(--panel);}
.ui .tline .it.ok .rl::after {background: var(--goldbar);}
.ui .tline .it.now .rl::after {background: var(--need); border-color: var(--need); box-shadow: 0 0 0 4px var(--needbg);}
.ui .tline .it:first-child .rl::before {top: 18px;}
.ui .tline .it:last-child .rl::before {bottom: auto; height: 18px;}
.ui .tline .c2 {background: var(--soft); border: 1px solid var(--line); border-radius: 18px; padding: 11px 12px; display: flex; gap: 11px; align-items: center; min-width: 0;}
.ui .tline .c2 > div {flex: 1; min-width: 0; display: grid; gap: 2px;}
.ui .tline .c2 b {font-size: 14px; font-weight: 600; color: var(--gold);}
.ui .tline .c2 small {font-size: 12px; color: var(--muted);}
.ui .ic {width: 36px; height: 36px; border-radius: 50%; background: var(--goldbg); color: var(--gold); display: grid; place-items: center; flex: none; font-size: 16px;}
.ui .ccal {display: grid; grid-template-columns: repeat(7, minmax(0,1fr)); gap: 6px 2px; text-align: center;}
.ui .ccal .wd {font-size: 10.5px; letter-spacing: .08em; text-transform: uppercase; color: var(--faint); font-weight: 600; padding-bottom: 4px;}
.ui .ccal button, .ui .ccal span.e {aspect-ratio: 1; width: 100%; max-width: 42px; justify-self: center; border-radius: 50%; border: 0; background: transparent; font-size: 14px; color: var(--ink); font-variant-numeric: tabular-nums; padding: 0;}
.ui .ccal button.reels {background: var(--goldbg); color: var(--gold); font-weight: 600;}
.ui .ccal button.carrossel {background: var(--verabg); color: var(--vera); font-weight: 600;}
.ui .ccal button.story {background: var(--okbg); color: var(--ok); font-weight: 600;}
.ui .ccal button.today {box-shadow: inset 0 0 0 1.5px var(--ink);}
.ui .ccal button.dim {opacity: .3;}
.ui .pills {display: flex; gap: 6px; flex-wrap: wrap;}
.ui .pills button {height: 30px; padding: 0 14px; border-radius: 999px; border: 1px solid var(--line); background: transparent; font-size: 12.5px; color: var(--muted);}
.ui .pills button.on {background: var(--goldbg); border-color: var(--goldbar); color: var(--gold); font-weight: 600;}
.ui .duo {display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 10px;}
.ui .stat {background: var(--soft); border-radius: 20px; padding: 14px; display: grid; gap: 8px; min-width: 0;}
.ui .stat span {font-size: 12px; color: var(--muted); line-height: 1.3;}
.ui .stat b {font-family: var(--serif); font-size: 38px; font-weight: 400; line-height: 1; color: var(--gold);}
.ui .deep {background: var(--deep); color: var(--deepInk); border-radius: 30px 30px 22px 22px; padding: 12px 16px 18px; display: grid; gap: 12px; min-width: 0;}
.ui .deep::before {content: ''; justify-self: center; width: 38px; height: 4px; border-radius: 99px; background: var(--deepMut); opacity: .6;}
.ui .deep h3 {margin: 0; font-size: 17px; font-weight: 600; display: flex; justify-content: space-between; align-items: baseline; gap: 8px;}
.ui .deep h3 small {font-weight: 400; font-size: 12px; color: var(--deepMut);}
.ui .deep .story {background: var(--deepCard); color: var(--deepCardInk); border-color: transparent; border-radius: 22px;}
.ui .deep .story ol, .ui .deep .story .mut {color: var(--muted);}
:root:not([data-tema="escuro"]) .ui .deep .story ol, :root:not([data-tema="escuro"]) .ui .deep .story .mut {color: #5E6270;}
.ui .play {display: flex; align-items: center; justify-content: space-between; gap: 8px; background: var(--soft); border-radius: 999px; padding: 4px 4px 4px 14px; font-size: 12.5px; font-weight: 500;}
.ui .play button {height: 34px; padding: 0 14px; border-radius: 999px; border: 0; background: var(--goldbar); color: #fff; font-weight: 600; font-size: 12.5px; white-space: nowrap;}
.ui .play button.done {background: var(--ok);}
.ui .moodpills {display: flex; gap: 6px; flex-wrap: wrap;}
.ui .moodpills button {height: 40px; padding: 0 14px 0 10px; border-radius: 999px; border: 1px solid var(--line); background: var(--soft); display: flex; align-items: center; gap: 7px; font-size: 13px; color: var(--ink);}
.ui .moodpills button span {font-size: 20px;}
.ui .moodpills button[aria-pressed="true"] {background: var(--btn); color: var(--btnink); border-color: var(--btn);}
.ui .aihead {display: flex; justify-content: space-between; align-items: center; gap: 8px; flex-wrap: wrap;}
.ui .mini {display: flex; gap: 6px; align-items: center;}
.ui .mini span {font-size: 20px;}
.ui .b.out.vera {background: var(--verabg); color: var(--ink); border: 1px solid rgba(78,97,140,.22);}
.ui .b.out.auto {background: var(--soft); color: var(--ink); border: 1px dashed var(--faint);}
.ui .b .who {display: block; font-size: 11px; font-weight: 600; opacity: .85; margin-bottom: 3px;}
.ui .b.vera .who {color: var(--vera);}
.ui .b.auto .who {color: var(--muted);}
.ui .qbtns {display: grid; gap: 4px; margin-top: 8px;}
.ui .qbtns span {display: block; text-align: center; padding: 7px; border-radius: 10px; background: var(--panel); border: 1px solid var(--line); color: var(--vera); font-weight: 600; font-size: 13px;}
.ui .phs {display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 4px; margin-bottom: 6px;}
.ui .phs i {aspect-ratio: 4 / 5; max-width: 100%; border-radius: 8px; background: linear-gradient(160deg, var(--goldbg), var(--verabg)); display: block;}
.ui .sys.need {background: var(--needbg); color: var(--need);}
.ui .sys.vera {background: var(--verabg); color: var(--vera);}
.ui .sys.ok {background: var(--okbg); color: var(--ok);}
.ui .sys.soft {background: var(--panel); color: var(--muted); border: 1px solid var(--line);}
.ui .typing .dots3 {display: inline-flex; gap: 4px; padding: 4px 0;}
.ui .dots3 i {width: 7px; height: 7px; border-radius: 50%; background: var(--vera); display: block; animation: bob 1.1s infinite ease-in-out;}
.ui .dots3 i:nth-child(2) {animation-delay: .15s;}
.ui .dots3 i:nth-child(3) {animation-delay: .3s;}
@keyframes bob { 0%, 80%, 100% { transform: translateY(0); opacity: .4; } 40% { transform: translateY(-4px); opacity: 1; } }
.ui .vpres {display: flex; align-items: center; gap: 6px 10px; padding: 9px 12px; border-radius: 14px; background: var(--verabg); color: var(--vera); font-size: 13px; font-weight: 600; flex-wrap: wrap;}
.ui .vpres.need {background: var(--needbg); color: var(--need);}
.ui .vpres.ok {background: var(--okbg); color: var(--ok);}
.ui .pulse {width: 9px; height: 9px; border-radius: 50%; background: var(--vera); flex: none; animation: pulse 1.6s infinite;}
@keyframes pulse { 0% { box-shadow: 0 0 0 0 rgba(78,97,140,.55); } 70% { box-shadow: 0 0 0 9px rgba(78,97,140,0); } 100% { box-shadow: 0 0 0 0 rgba(78,97,140,0); } }
.ui .vbub {max-width: 90%; padding: 10px 13px; border-radius: 16px; font-size: 14px; line-height: 1.45;}
@media (max-width: 760px) {
  .ui .split {grid-template-columns: minmax(0,1fr);}
  .ui .fn .s {grid-template-columns: minmax(0,104px) minmax(0,1fr) 72px; font-size: 12px;}
  .ui .mc {min-height: 48px; padding: 4px; border-radius: 8px;}
  .ui .mc small {font-size: 9.5px;}
  .ui .mc .d {font-size: 11.5px;}
  .ui .hero {padding: 18px 16px;}
  .ui .ring {width: 100px; height: 100px;}
  .ui .ring > div {width: 78px; height: 78px;}
  .ui .ring b {font-size: 25px;}
  .ui .moods button {border-radius: 14px; padding: 9px 0 7px; font-size: 10.5px;}
  .ui .moods button span {font-size: 24px;}
}
@media (max-width: 760px) {
  .ui .work {padding: 10px;}
  .ui .chatgrid {grid-template-columns: minmax(0,1fr);}
  .ui .chatgrid .hidem {display: none;}
  .ui .msgs {max-height: 46vh;}
}
.ui .roban {display: flex; flex-wrap: wrap; gap: 4px 10px; align-items: center; padding: 10px 12px; border-radius: 14px; background: var(--verabg); color: var(--vera); font-size: 13px;}
.ui .roban.need {background: var(--needbg); color: var(--need);}
.ui .roban.ok {background: var(--okbg); color: var(--ok);}
.ui .roban b {font-weight: 700;}
.ui .roban .mut {color: inherit; opacity: .85; flex-basis: 100%; font-size: 12px;}
.ui .nstrip {display: grid; gap: 8px; padding: 12px; border-radius: 14px; background: var(--goldbg); border: 1px dashed var(--goldbar, var(--gold));}
.ui .nstrip .nhead {display: flex; justify-content: space-between; gap: 8px; align-items: center; border: 0; background: transparent; padding: 0; font-size: 13.5px; color: var(--ink); text-align: left;}
.ui .nstrip .nhead span {font-size: 12px; color: var(--muted);}
.ui .nt {display: grid; gap: 2px; padding: 9px 11px; border-radius: 12px; background: var(--panel); border: 1px solid var(--line); font-size: 13px; min-width: 0; overflow-wrap: anywhere;}
.ui .nt.dr {border-color: var(--gold);}
.ui .nt b {font-size: 12px;}
.ui .nt small {color: var(--muted);}
.ui .ncompose {display: flex; gap: 8px; flex-wrap: wrap;}
.ui .ncompose input {flex: 1; min-width: 0; height: 40px; border-radius: 12px; border: 1px solid var(--line); background: var(--soft); padding: 0 12px; color: var(--ink);}
.ui .selx {height: 36px; border-radius: 10px; border: 1px solid var(--line); background: var(--soft); padding: 0 8px; color: var(--ink); max-width: 100%;}
.ui .aud {display: flex; align-items: center; gap: 10px; min-width: 190px;}
.ui .aud .play {width: 34px; height: 34px; border-radius: 99px; border: 0; background: var(--gold); color: #fff; flex: none;}
.ui .wave {display: inline-flex; align-items: center; gap: 2px; height: 26px; flex: 1;}
.ui .wave i {width: 3px; border-radius: 3px; background: currentColor; opacity: .45; display: block;}
.ui .trans {margin-top: 6px; padding: 7px 9px; border-radius: 10px; background: var(--verabg); color: var(--vera); font-size: 12.5px; display: grid; gap: 2px;}
.ui .trans b {font-size: 11px; letter-spacing: .04em; text-transform: uppercase;}
.ui .imgph {width: 190px; max-width: 100%; aspect-ratio: 4/3; border-radius: 12px; background: linear-gradient(135deg, var(--goldbg), var(--soft)); display: grid; place-items: center; font-size: 30px; margin-bottom: 6px;}
.ui .docchip {display: flex; gap: 10px; align-items: center; padding: 8px 10px; border-radius: 12px; background: var(--soft); font-size: 20px;}
.ui .docchip b {font-size: 13px; display: block;}
.ui .docchip small {display: block; color: var(--muted);}
.ui .b.in .note2, .ui .b .note2 {display: block; font-size: 11.5px; opacity: .75;}
.ui .react {align-self: flex-start; font-size: 12px; color: var(--muted); display: flex; gap: 6px; align-items: center; padding-left: 6px;}
.ui .react span:first-child {font-size: 18px;}
.ui .b.unsup {background: var(--warnbg); color: var(--warn);}
.ui .newlead {position: fixed; top: calc(12px + env(safe-area-inset-top, 0px)); right: 12px; left: 12px; max-width: 420px; margin-left: auto; z-index: 90; display: grid; gap: 8px; padding: 14px; border-radius: 18px; background: #FFFDF8; border: 1px solid var(--goldbar, var(--gold)); box-shadow: 0 18px 50px rgba(0,0,0,.25); animation: nlin .35s ease;}
:root[data-tema="escuro"] .ui .newlead, :root[data-tema="escuro"] .ui .sysmodal > div {background: #1D2436;}
.ui .newlead.need {background: linear-gradient(var(--needbg), var(--needbg)), #FFFDF8;}
:root[data-tema="escuro"] .ui .newlead.need {background: linear-gradient(var(--needbg), var(--needbg)), #1D2436;}
.ui .newlead.need {border-color: var(--need);}
.ui .newlead b {font-size: 15px;}
.ui .newlead .nlc {font-variant-numeric: tabular-nums; font-weight: 700;}
@keyframes nlin { from { transform: translateY(-14px); opacity: 0; } to { transform: none; opacity: 1; } }
.ui .sysbar {position: fixed; top: 0; left: 0; right: 0; z-index: 95; padding: calc(8px + env(safe-area-inset-top, 0px)) 16px 8px; display: flex; gap: 10px; flex-wrap: wrap; align-items: center; justify-content: center; font-size: 13px; font-weight: 600; background: linear-gradient(var(--warnbg), var(--warnbg)), #FFFDF8; color: var(--warn); text-align: center;}
.ui .sysbar.need {background: linear-gradient(var(--needbg), var(--needbg)), #FFFDF8; color: var(--need);}
:root[data-tema="escuro"] .ui .sysbar {background: linear-gradient(var(--warnbg), var(--warnbg)), #1D2436;}
:root[data-tema="escuro"] .ui .sysbar.need {background: linear-gradient(var(--needbg), var(--needbg)), #1D2436;}
.ui .sysmodal {position: fixed; inset: 0; z-index: 96; display: grid; place-items: center; padding: 16px; background: rgba(20, 22, 30, .55); backdrop-filter: blur(6px);}
.ui .sysmodal > div {width: min(420px, 100%); display: grid; gap: 12px; padding: 22px; border-radius: 22px; background: #FFFDF8; text-align: center;}
.ui .sysmodal .big2 {font-size: 34px;}
.ui .empty {display: grid; gap: 6px; place-items: center; text-align: center; padding: 22px 14px; border-radius: 16px; border: 1px dashed var(--line); background: var(--soft);}
.ui .empty .em2 {font-size: 30px;}
.ui .empty b {font-size: 14.5px;}
.ui .empty span.m {font-size: 12.5px; color: var(--muted); max-width: 34ch;}
.ui .skel {display: grid; gap: 8px;}
.ui .skel i {display: block; height: 14px; border-radius: 8px; background: linear-gradient(90deg, var(--soft), var(--line), var(--soft)); background-size: 200% 100%; animation: shim 1.3s infinite linear;}
@keyframes shim { to { background-position: -200% 0; } }
.ui .kanban4 {display: grid; grid-template-columns: repeat(4, minmax(210px, 1fr)); gap: 10px; overflow-x: auto; padding-bottom: 6px;}
.ui .kanban4 .col2 {display: grid; gap: 8px; align-content: start; padding: 10px; border-radius: 16px; background: var(--soft); min-width: 0;}
.ui .kanban4 h4 {margin: 0; font-size: 13px; display: flex; justify-content: space-between; align-items: center;}
.ui .kanban4 .card2 {display: grid; gap: 6px; padding: 10px; border-radius: 12px; background: var(--panel); border: 1px solid var(--line); font-size: 13px;}
.ui .dayrow {display: grid; grid-template-columns: minmax(150px, 200px) 1fr; gap: 6px 12px; align-items: start; padding: 10px 0; border-top: 1px solid var(--line);}
.ui .dayrow:first-of-type {border-top: 0;}
.ui .faixas {display: flex; flex-wrap: wrap; gap: 6px; align-items: center;}
.ui .faixas input[type=time], .ui .fld input[type=date], .ui .selx[type=date] {height: 36px; border-radius: 10px; border: 1px solid var(--line); background: var(--soft); padding: 0 8px; color: var(--ink);}
.ui .keybox {font-family: ui-monospace, Menlo, monospace; letter-spacing: .08em; padding: 10px 12px; border-radius: 12px; background: var(--soft); text-align: center; word-break: break-all;}
.ui .qrfake {width: 148px; height: 148px; margin: 0 auto; border-radius: 12px; background: #fff; padding: 8px; display: grid; grid-template-columns: repeat(15, 1fr); gap: 1px;}
.ui .qrfake i {background: #1a2030; display: block;}
.ui .qrfake i.o {background: #fff;}
.ui .tag.vera {white-space: normal; max-width: 100%; text-align: left;}
@media (max-width: 760px) {
  .ui .kanban4 {grid-template-columns: repeat(4, 240px);}
  .ui .dayrow {grid-template-columns: 1fr;}
}
.ui .cols > * {min-width: 0;}
.ui .kv {flex-wrap: wrap;}
.ui .kv > span {min-width: 0;}
.ui .cols > * {min-width: 0;}
.ui .kv {flex-wrap: wrap;}
.ui .kv > span {min-width: 0;}
.ui .cr7 {display: grid; gap: 10px;}
.ui .thumb7 {width: 100%; box-sizing: border-box; position: relative; border-radius: 14px; min-height: 92px; padding: 12px; display: flex; flex-direction: column; justify-content: flex-end; color: #fff; overflow: hidden; background: linear-gradient(135deg, #1F2D4A, #4E618C);}
.ui .thumb7.b {background: linear-gradient(135deg, #5A3E1B, #B8893A);}
.ui .thumb7.c {background: linear-gradient(135deg, #3B3B46, #7C8089);}
.ui .thumb7 .pl {position: absolute; top: 10px; right: 12px; width: 30px; height: 30px; border-radius: 50%; background: rgba(255,255,255,.22); display: grid; place-items: center; font-size: 12px;}
.ui .thumb7 b {font-size: 15px;}
.ui .thumb7 small {opacity: .85;}
.ui .days7 {display: flex; gap: 6px; align-items: flex-end; height: 72px;}
.ui .days7 > div {flex: 1; display: grid; gap: 4px; justify-items: center; align-content: end; font-size: 10.5px; color: var(--muted);}
.ui .days7 i {display: block; width: 100%; border-radius: 6px 6px 2px 2px; background: var(--goldbar);}
.ui .steps7 {display: flex; gap: 4px; flex-wrap: wrap;}
.ui .steps7 span {font-size: 11.5px; padding: 4px 9px; border-radius: 999px; background: var(--soft); color: var(--muted); border: 1px solid var(--line);}
.ui .steps7 span.done {color: var(--ok);}
.ui .steps7 span.on {background: var(--goldbg); color: var(--gold); border-color: var(--goldbar); font-weight: 600;}
.ui .win7 {display: flex; gap: 10px; align-items: center; padding: 10px 12px; border-radius: 14px; background: var(--goldbg); color: var(--gold); font-size: 13.5px;}
.ui .dot8 {display: inline-block; width: 10px; height: 10px; border-radius: 50%; margin-right: 8px; vertical-align: baseline;}
.ui .cl8 {display: flex; gap: 6px; overflow-x: auto; padding: 2px 0 6px; scrollbar-width: none; -webkit-overflow-scrolling: touch;}
.ui .cl8::-webkit-scrollbar {display: none;}
.ui .cl8 button {flex: 0 0 auto; display: inline-flex; align-items: center; gap: 7px; min-height: 44px; padding: 0 14px; border-radius: 999px; border: 1px solid var(--line); background: var(--panel); color: var(--ink); font: inherit; font-size: 13.5px; cursor: pointer;}
.ui .cl8 button.on {background: var(--btn); color: var(--btnink); border-color: var(--btn); font-weight: 600;}
.ui .cl8 button i {width: 9px; height: 9px; border-radius: 50%; background: var(--c);}
.ui .cl8 button em {font-style: normal; font-size: 11.5px; min-width: 20px; height: 20px; padding: 0 6px; border-radius: 999px; display: inline-grid; place-items: center; background: var(--needbg); color: var(--need); font-weight: 700;}
.ui .cl8 button.on em {background: rgba(255,255,255,.22); color: inherit;}
.ui .cl8 button em.z {background: var(--soft); color: var(--muted); font-weight: 500;}
.ui .tagc {display: inline-flex; align-items: center; gap: 5px; font-size: 11.5px; padding: 2px 8px; border-radius: 999px; background: var(--soft); border: 1px solid var(--line); color: var(--ink); margin-left: 6px; vertical-align: middle; white-space: nowrap;}
.ui .tagc i {width: 7px; height: 7px; border-radius: 50%; background: var(--c);}
.ui .mc8 {display: grid; gap: 10px;}
.ui .mc8 .it {display: grid; gap: 8px; padding: 12px; border: 1px solid var(--line); border-radius: 14px; background: var(--soft); border-left: 4px solid var(--c);}
.ui .mc8 .it .top8 {display: flex; justify-content: space-between; gap: 8px; flex-wrap: wrap; align-items: center;}
.ui .vw9 {display: flex; gap: 6px; overflow-x: auto; padding: 2px 0 4px; scrollbar-width: none;}
.ui .vw9::-webkit-scrollbar {display: none;}
.ui .vw9 button {flex: 0 0 auto; min-height: 40px; padding: 0 14px; border-radius: 10px; border: 1px solid transparent; background: transparent; color: var(--muted); font: inherit; font-size: 13.5px; cursor: pointer; display: inline-flex; gap: 7px; align-items: center;}
.ui .vw9 button.on {background: var(--panel); border-color: var(--line); color: var(--ink); font-weight: 600; box-shadow: 0 1px 0 var(--line);}
.ui .vw9 button small {color: var(--faint); font-size: 11.5px;}
.ui .bd9 {display: grid; grid-template-columns: repeat(5, minmax(236px, 1fr)); gap: 10px; align-items: start;}
.ui .cl9 {display: grid; gap: 8px; align-content: start; padding: 10px; border-radius: 16px; background: var(--soft); min-height: 120px; min-width: 0;}
.ui .cl9.over {outline: 2px dashed var(--goldbar); outline-offset: -4px;}
.ui .cl9 > h4 {margin: 0; font-size: 12.5px; display: flex; justify-content: space-between; align-items: center; gap: 6px; text-transform: none; letter-spacing: 0; color: var(--ink);}
.ui .ca9 {display: grid; gap: 7px; padding: 10px 10px 10px 12px; border-radius: 12px; background: var(--panel); border: 1px solid var(--line); border-left: 4px solid var(--c, var(--line)); font-size: 13px; cursor: grab; text-align: left; font-family: inherit; color: var(--ink); width: 100%; box-sizing: border-box;}
.ui .ca9:active {cursor: grabbing;}
.ui .ca9.dragging {opacity: .45;}
.ui .ca9 b {font-weight: 600; line-height: 1.3;}
.ui .ca9 .meta9 {display: flex; flex-wrap: wrap; gap: 4px 6px; align-items: center; font-size: 11.5px; color: var(--muted);}
.ui .ca9 .late {color: var(--need); font-weight: 600;}
.ui .pv9 {width: 22px; height: 22px; border-radius: 50%; background: var(--goldbg); color: var(--gold); font-size: 10.5px; font-weight: 700; display: inline-grid; place-items: center; border: 1px solid var(--line);}
.ui .pr9 {width: 8px; height: 8px; border-radius: 50%; display: inline-block; background: var(--faint);}
.ui .pr9.Alta {background: var(--need);}
.ui .pr9.Média {background: var(--warn);}
.ui .mv9 {justify-self: end; min-height: 32px; padding: 0 10px; font-size: 12px;}
.ui .fl9 {display: flex; gap: 8px; flex-wrap: wrap; align-items: center;}
.ui .fl9 .selx {height: 40px;}
.ui .st9 {display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px;}
.ui .sb9 {display: flex; gap: 2px; height: 14px; border-radius: 6px; overflow: hidden; background: var(--soft);}
.ui .sb9 i {display: block; height: 100%; min-width: 4px;}
.ui .lg9 {display: flex; gap: 12px; flex-wrap: wrap; font-size: 12px; color: var(--muted);}
.ui .lg9 span::before {content: ''; display: inline-block; width: 9px; height: 9px; border-radius: 3px; margin-right: 6px; background: var(--c);}
.ui .tb9 th[data-a] {cursor: pointer;}
.ui .tb9 td, .ui .tb9 th {white-space: nowrap;}
.ui .tb9 td.t9 {white-space: normal; min-width: 200px;}
.ui .tb9 tr.gh td {background: var(--soft); font-weight: 600; color: var(--ink);}
@media (max-width: 760px) {
  .ui .bd9 {grid-template-columns: repeat(5, 252px);}
}
.ui .row10 {display: grid; gap: 8px; padding: 12px 0; border-top: 1px solid var(--line);}
.ui .row10:first-child {border-top: 0; padding-top: 2px;}
.ui .row10 .top10 {display: flex; justify-content: space-between; align-items: flex-start; gap: 10px; flex-wrap: wrap;}
.ui .row10 b {font-weight: 600;}
.ui .row10 .when10 {font-variant-numeric: tabular-nums; color: var(--ink); font-weight: 600; font-size: 13.5px;}
.ui .row10 .acts10 {display: flex; gap: 8px; flex-wrap: wrap;}
.ui .row10 .acts10 .btn {min-height: 40px;}
.ui .g10 {display: inline-flex; align-items: center; gap: 5px; font-size: 11.5px; padding: 2px 8px; border-radius: 999px; background: var(--soft); border: 1px solid var(--line); color: var(--ink); white-space: nowrap;}
.ui .g10::before {content: ''; width: 7px; height: 7px; border-radius: 50%; background: var(--ok);}
.ui .g10.pend::before {background: var(--warn);}
.ui .g10.sem::before {background: var(--faint);}
.ui .cn10 {display: flex; gap: 8px; flex-wrap: wrap; align-items: center; font-size: 12.5px; color: var(--muted);}
.ui .cn10 .bad10 {color: var(--need); font-weight: 600;}
.ui .msg10 {padding: 10px 12px; border-radius: 12px; font-size: 13px; background: var(--soft); border: 1px solid var(--line);}
.ui .msg10.bad {border-color: var(--need); color: var(--need);}
.ui .msg10.good {border-color: var(--ok);}
.ui .day10 {font-size: 12px; text-transform: uppercase; letter-spacing: .06em; color: var(--muted); margin: 10px 0 2px; font-weight: 600;}
.ui details.demo10 {border: 1px dashed var(--line); border-radius: 14px; padding: 10px 14px;}
.ui details.demo10 summary {cursor: pointer; font-size: 13px; color: var(--muted); min-height: 32px; display: flex; align-items: center;}
.ui .r11 {display: grid; gap: 8px; padding: 12px 0; border-top: 1px solid var(--line);}
.ui .r11:first-of-type {border-top: 0;}
.ui .r11 .t11 {display: flex; justify-content: space-between; align-items: flex-start; gap: 10px; flex-wrap: wrap;}
.ui .r11 b {font-weight: 600;}
.ui .r11 .a11 {display: flex; gap: 8px; flex-wrap: wrap;}
.ui .r11 .a11 .btn {min-height: 40px;}
.ui .num11 {font-variant-numeric: tabular-nums;}
.ui .tb11 {width: 100%; border-collapse: collapse; font-size: 13px; font-variant-numeric: tabular-nums;}
.ui .tb11 th {text-align: left; font-weight: 600; color: var(--muted); font-size: 11.5px; text-transform: uppercase; letter-spacing: .05em; padding: 6px 8px 6px 0; border-bottom: 1px solid var(--line);}
.ui .tb11 td {padding: 8px 8px 8px 0; border-bottom: 1px solid var(--line); vertical-align: top;}
.ui .tb11 td.r, .ui .tb11 th.r {text-align: right;}
.ui .tb11 tr.tot td {font-weight: 700; border-bottom: 0;}
.ui .tw11 {overflow-x: auto;}
@media (max-width: 480px) {
  .ui .hm11 {display: none;}
}
.ui .seg11 {display: inline-flex; gap: 6px; flex-wrap: wrap;}
.ui .seg11 button {min-height: 40px; padding: 0 14px; border-radius: 12px; border: 1px solid var(--line); background: var(--soft); color: var(--muted); font: inherit; font-size: 13.5px; cursor: pointer;}
.ui .seg11 button[aria-pressed="true"] {border-color: var(--goldbar); background: var(--goldbg); color: var(--ink); font-weight: 600;}
.ui .it11 {display: grid; grid-template-columns: minmax(0, 1fr) 130px 40px; gap: 8px; align-items: end;}
@media (max-width: 420px) {
  .ui .it11 {grid-template-columns: minmax(0, 1fr) 104px 40px;}
}
.ui .it11 .x11 {min-height: 44px; border-radius: 12px; border: 1px solid var(--line); background: var(--soft); color: var(--muted); cursor: pointer; font-size: 18px;}
.ui .box11 {padding: 12px; border-radius: 14px; border: 1px solid var(--line); background: var(--soft); display: grid; gap: 8px;}
.ui .box11.bad {border-color: var(--need); background: var(--needbg); color: var(--need);}
.ui .box11.warn {border-color: var(--warn); background: var(--warnbg); color: var(--warn);}
.ui .box11.good {border-color: var(--ok); background: var(--okbg); color: var(--ok);}
.ui .ck11 {display: flex; gap: 10px; align-items: flex-start; font-size: 13.5px; cursor: pointer;}
.ui .ck11 input {width: 20px; height: 20px; margin: 1px 0 0; flex: none; accent-color: var(--goldbar);}
.ui .cl11 {display: grid; gap: 6px;}
.ui .cl11 label {display: flex; align-items: center; gap: 10px; min-height: 44px; padding: 0 12px; border-radius: 12px; border: 1px solid var(--line); background: var(--soft); font-size: 14px; cursor: pointer;}
.ui .cl11 label input[type="checkbox"] {width: 20px; height: 20px; accent-color: var(--goldbar);}
.ui .cl11 label .pr11 {margin-left: auto; display: flex; align-items: center; gap: 6px; font-size: 12px; color: var(--muted);}
.ui .cl11 label .pr11 input {accent-color: var(--goldbar);}
.ui .chart11 {display: grid; gap: 12px;}
.ui .chart11 .m11 {display: grid; gap: 5px;}
.ui .chart11 .m11 .bars {display: grid; gap: 4px;}
.ui .chart11 .m11 .b {height: 14px; border-radius: 0 4px 4px 0; min-width: 2px;}
.ui .chart11 .lg {display: flex; gap: 16px; flex-wrap: wrap; font-size: 12.5px; color: var(--muted);}
.ui .chart11 .lg i {display: inline-block; width: 10px; height: 10px; border-radius: 3px; margin-right: 6px; vertical-align: -1px;}
.ui .b-sp {background: var(--vera);}
.ui .b-rv {background: var(--goldbar);}
.ui .paper11 {background: #FFFFFF; color: #1A1F2B; border-radius: 6px; padding: 26px 24px; box-shadow: 0 1px 2px rgba(0,0,0,.08), 0 0 0 1px rgba(0,0,0,.06); display: grid; gap: 14px; font-size: 13px;}
.ui .paper11 .eb {font-size: 10px; letter-spacing: .14em; font-weight: 700; color: #6B6F78; display: flex; justify-content: space-between; gap: 8px; flex-wrap: wrap;}
.ui .paper11 h4 {margin: 0; font-size: 22px; letter-spacing: -.01em; border-bottom: 2px solid #1A1F2B; padding-bottom: 10px;}
.ui .paper11 dl {margin: 0; display: grid; grid-template-columns: 150px minmax(0, 1fr); gap: 6px 10px;}
.ui .paper11 dt {color: #6B6F78; font-weight: 600; font-size: 12px;}
.ui .paper11 dd {margin: 0;}
@media (max-width: 420px) {
  .ui .paper11 dl {grid-template-columns: minmax(0, 1fr);}
  .ui .paper11 dd {margin-bottom: 4px;}
}
.ui .paper11 .sum {background: #F2F2F2; padding: 14px; display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 10px;}
.ui .paper11 .sum span {display: block; font-size: 11px; color: #6B6F78; font-weight: 600;}
.ui .paper11 .sum b {font-size: 22px; font-variant-numeric: tabular-nums;}
.ui .paper11 .tb11 th {color: #6B6F78; border-color: #DDD;}
.ui .paper11 .tb11 td {border-color: #EEE;}
.ui .paper11 .note {color: #6B6F78; font-size: 11.5px; line-height: 1.5;}
.ui .paper11 .sig {display: grid; grid-template-columns: 1fr 1fr; gap: 28px; margin-top: 18px;}
.ui .paper11 .sig div {border-top: 1px solid #555; padding-top: 6px; font-size: 12px; color: #6B6F78;}
.ui .n12 {width: 40px; height: 40px; border-radius: 12px; display: grid; place-items: center; font-weight: 700; font-size: 13px; background: var(--soft); border: 1px solid var(--line); font-variant-numeric: tabular-nums; flex: none;}
.ui .row.sel .n12 {background: var(--goldbg); border-color: var(--goldbar);}
.ui .tl12 {display: grid; gap: 10px;}
.ui .cta12 {display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 8px;}
.ui .cta12 > div {padding: 10px 12px; border-radius: 12px; border: 1px solid var(--line); background: var(--soft); display: grid; gap: 4px; font-size: 13px;}
.ui .drv12 {font-size: 12.5px; padding: 10px 12px; border-radius: 12px; background: var(--soft); border: 1px dashed var(--line); word-break: break-word;}
.ui .pn12 {display: grid; gap: 4px; padding: 12px; border-radius: 14px; border: 1px solid var(--line); background: var(--soft); font-size: 13.5px;}
.ui .pn12 small {color: var(--muted);}
.ui '+CSS+'


:root {--rev: #7A3E5A; --revbg: #F6ECF1; --revline: #E6CBD8;}
:root[data-tema="escuro"] .ui { --rev: #E9B8CE; --revbg: rgba(160,80,120,.22); --revline: rgba(233,184,206,.28)}
.ui .tag.rev {background: var(--revbg); color: var(--rev);}
.ui .vpres.rev {background: var(--revbg); color: var(--rev);}
.ui .bev14 {border: 1px solid rgba(184,137,58,.4); background: var(--goldbg); border-radius: 16px; padding: 12px 14px; display: grid; gap: 10px;}
.ui .bev14 .hd {display: flex; justify-content: space-between; align-items: baseline; gap: 8px; flex-wrap: wrap;}
.ui .bev14 .hd b {font-size: 11px; letter-spacing: .1em; text-transform: uppercase; color: var(--gold);}
.ui .bev14 .val {font-size: 15px; font-weight: 600;}
.ui .bev14 .opts {display: flex; gap: 6px; flex-wrap: wrap;}
.ui .bev14 .opts button {height: 32px; padding: 0 12px; border-radius: 999px; border: 1px solid var(--line); background: var(--panel); font-size: 12.5px; color: var(--ink);}
.ui .bev14 .opts button[aria-pressed="true"] {background: var(--btn); color: var(--btnink); border-color: var(--btn);}
.ui .bev14 .link {border: 0; background: none; padding: 0; color: var(--muted); font-size: 12.5px; text-decoration: underline; justify-self: start;}
.ui .chip.attn {border-color: var(--goldbar); color: var(--gold); background: var(--goldbg); font-weight: 600;}
.ui .call14 {border: 1px solid var(--line); border-radius: 16px; background: var(--panel); display: grid; gap: 10px; padding: 12px 14px;}
.ui .call14.open {border-color: var(--revline); box-shadow: 0 0 0 3px var(--revbg);}
.ui .call14 .l1 {display: flex; gap: 8px; align-items: center; flex-wrap: wrap; justify-content: space-between;}
.ui .call14 .l1 > div {display: flex; gap: 8px; align-items: center; flex-wrap: wrap; min-width: 0;}
.ui .call14 .script {padding: 12px 14px; border-radius: 14px; background: var(--soft); font-size: 14px; line-height: 1.5;}
.ui .call14 .auth {display: flex; gap: 10px; align-items: flex-start; padding: 12px 14px; border-radius: 14px; border: 1px dashed var(--revline); font-size: 13px; line-height: 1.45;}
.ui .call14 .auth input {width: 18px; height: 18px; margin-top: 2px; flex: none; accent-color: var(--rev);}
.ui .call14 .outs {display: flex; gap: 6px; flex-wrap: wrap;}
.ui .call14 .outs button {height: 34px; padding: 0 12px; border-radius: 10px; border: 1px solid var(--line); background: var(--soft); font-size: 12.5px; color: var(--ink);}
.ui .call14 .outs button.pos {border-color: var(--revline); color: var(--rev); background: var(--revbg); font-weight: 600;}
.ui .call14 .err {color: var(--need); font-size: 12.5px;}
.ui .rvt td input {border: 1px solid var(--line); background: var(--soft); border-radius: 8px; padding: 5px 8px; min-width: 140px; font-size: 13px;}
.ui .rvt tr.out14 td {opacity: .55;}
.ui .days14 {display: flex; gap: 8px; flex-wrap: wrap; align-items: end;}
.ui .days14 label {display: grid; gap: 4px; font-size: 12px; color: var(--muted);}
.ui .days14 input {width: 72px; height: 40px; border-radius: 10px; border: 1px solid var(--line); background: var(--soft); padding: 0 10px; font-variant-numeric: tabular-nums;}
.ui .code14 {display: flex; gap: 8px; justify-content: center;}
.ui .code14 input {width: 160px; height: 46px; text-align: center; font-size: 22px; letter-spacing: .4em; border-radius: 12px; border: 1px solid var(--line); background: var(--soft);}
