/* Consistent, theme-aware surfaces. No new information is hidden by this layer. */
:root{--gui-surface:color-mix(in srgb,var(--theme-panel) 86%,var(--theme-bg));--gui-edge:color-mix(in srgb,var(--theme-edge) 72%,var(--theme-bg));--gui-shadow:0 18px 48px #0002}
:is(.panel,.assistant-panel,.visitor-reviews,.support-card,.clarity-details){border-color:var(--gui-edge);box-shadow:var(--gui-shadow)}
html[data-theme] #copiloto .assistant-panel{background:var(--gui-surface);border-radius:24px;padding:26px;gap:16px 26px;max-width:1120px}
#copiloto .assistant-heading{padding-bottom:16px;border-bottom:1px solid var(--gui-edge);align-items:center}
#copiloto .assistant-heading h2{font-size:1.25rem;line-height:1.4;letter-spacing:-.025em}
#copiloto .assistant-panel>.messages{height:clamp(240px,32vh,340px);padding:14px 10px 4px 0;scroll-padding:16px;overscroll-behavior:contain}
#copiloto .msg{padding:16px 18px;line-height:1.7;box-shadow:0 3px 10px #0001}
html[data-theme] #copiloto .msg.ai{background:var(--theme-panel);border-color:var(--gui-edge)}
html[data-theme] #copiloto .msg.user{background:color-mix(in srgb,var(--theme-accent) 14%,var(--theme-panel));border-color:color-mix(in srgb,var(--theme-accent) 35%,var(--gui-edge))}
#copiloto .chat-form{padding:10px;border-radius:18px;box-shadow:0 4px 18px #0002}
#copiloto .chat-form button{width:46px;height:46px;flex-shrink:0;border-radius:13px}
#copiloto .suggestions{gap:8px;margin:0}
#copiloto .suggestions button{font-size:.875rem;min-height:42px;padding:9px 12px}
#copiloto .connect-beta{padding:14px 16px;border:1px solid var(--gui-edge);border-radius:14px;background:var(--theme-bg)}
#copiloto .avatar-companion{padding:16px;border-radius:20px;background:linear-gradient(155deg,color-mix(in srgb,var(--theme-accent) 9%,var(--theme-panel)),var(--theme-bg));border-color:var(--gui-edge);box-shadow:inset 0 1px 0 #ffffff09}
.avatar-topline{gap:6px;padding-bottom:10px;border-bottom:1px solid var(--gui-edge)}
.avatar-topline .avatar-label{flex-basis:100%;margin-bottom:4px;font-size:.75rem}
.avatar-topline button{min-height:40px;padding:7px 11px;border:1px solid var(--gui-edge);border-radius:10px;background:var(--theme-panel)}
#copiloto .avatar-stage{height:346px;margin:14px 0;background:radial-gradient(ellipse at 50% 45%,color-mix(in srgb,var(--theme-accent) 12%,transparent),transparent 70%)}
.avatar-halo{border-color:color-mix(in srgb,var(--theme-accent) 24%,transparent);opacity:.45}
.avatar-voices{padding-top:12px;border-top:1px solid var(--gui-edge);line-height:1.5}
.avatar-voices select{background:var(--theme-panel);color:var(--text);border:1px solid var(--theme-edge);padding:10px 12px;border-radius:12px;font:inherit}
.avatar-listen{width:100%;padding:10px 12px;border:1px solid var(--gui-edge);border-radius:12px;background:var(--theme-panel);text-align:center}
.avatar-wave{width:44px;height:44px;box-shadow:0 4px 16px #0003}
.avatar-member-name{white-space:nowrap;max-width:calc(100% - 8px);font-size:.75rem;padding:5px 8px;border-color:#ffffff18}
.avatar-status{line-height:1.6;margin-top:12px!important}.avatar-help{line-height:1.7;margin-top:8px!important}
html[data-theme] .catalog-tabs{display:flex;gap:6px;flex-wrap:wrap;padding:6px;background:var(--theme-bg);border:1px solid var(--gui-edge);border-radius:14px;margin-bottom:20px}
html[data-theme] .catalog-tabs button{border-radius:9px;padding:11px 16px;min-height:44px;border:1px solid transparent;font-size:.875rem;color:var(--muted)}
html[data-theme] .catalog-tabs button[aria-selected=true]{background:var(--theme-raised);color:var(--text);border-color:var(--theme-edge);box-shadow:0 3px 9px #0002}
.catalog-tabs button:after{display:none}
.family-branch{box-shadow:0 5px 18px #0001}.family-branch[open]{box-shadow:0 8px 26px #0002}
.os-card{border-radius:18px}.os-card .card-actions{border-top:1px solid var(--gui-edge);padding-top:16px;margin-top:auto}
.visitor-review{border-color:var(--gui-edge);box-shadow:0 5px 20px #0001}.visitor-form{border-radius:18px}
dialog{border-radius:24px;box-shadow:0 28px 100px #0008}.dialog-heading{padding-bottom:18px;border-bottom:1px solid var(--gui-edge);margin-bottom:20px}
.dialog-heading .icon-button{background:var(--theme-bg);border:1px solid var(--gui-edge);border-radius:12px;min-width:44px;min-height:44px}
:is(.field-grid,.visitor-reviews,.support-field) :is(input:not([type=checkbox]):not([type=radio]),textarea,select){border-radius:12px}
:is(.chat-form,.search-field,.visitor-field,.support-field):focus-within{border-color:var(--theme-accent)}
@media(min-width:1201px){#copiloto .assistant-panel{grid-template-columns:minmax(0,1fr) 350px}}
@media(min-width:791px) and (max-width:1200px){#copiloto .assistant-panel{grid-template-columns:minmax(0,1fr) 280px}}
@media(max-width:790px){html[data-theme] #copiloto .assistant-panel{padding:18px;gap:16px;border-radius:20px}#copiloto .avatar-stage{height:310px}.catalog-tabs button{flex:1 1 auto;text-align:center}.avatar-topline .avatar-label{flex-basis:auto;margin:0 auto 0 0}dialog{border-radius:18px}#copiloto .msg{padding:14px}.avatar-member-name{padding:4px 6px}html[data-theme] .catalog-tabs button{padding:10px 12px}.dialog-heading{gap:12px}}
@media(max-width:390px){#copiloto .avatar-stage{height:290px}.avatar-topline .avatar-label{flex-basis:100%;margin-bottom:4px}#copiloto .chat-form{padding:8px}#copiloto .msg.user{margin-left:12px}}
@media(prefers-reduced-motion:reduce){.avatar-companion *{transition:none!important;animation:none!important}}

/* A calmer workbench: one hierarchy, independent chat and companion columns. */
body:not(.is-welcome) main{max-width:1360px;padding-bottom:28px}
.clarity-route{background:none;margin-bottom:26px}
.clarity-route ol{gap:10px;border:0}
.clarity-route .clarity-stop{min-height:74px;padding:14px 16px;margin:0;border:1px solid var(--gui-edge);border-radius:14px;background:color-mix(in srgb,var(--theme-panel) 88%,transparent);transition:background .2s,border-color .2s}
.clarity-number{display:grid;place-items:center;width:32px;height:32px;border:1px solid var(--gui-edge);border-radius:10px;font-size:.75rem;background:var(--theme-bg)}
.clarity-stop[aria-current=step]{background:color-mix(in srgb,var(--theme-accent) 10%,var(--theme-panel));border-color:color-mix(in srgb,var(--theme-accent) 55%,var(--gui-edge));box-shadow:inset 0 2px 0 color-mix(in srgb,var(--theme-accent) 70%,transparent)}
.clarity-stop[aria-current=step] .clarity-number{color:var(--theme-bg);background:var(--theme-accent);border-color:transparent}
.clarity-stop-copy b{font-size:.9375rem}.clarity-stop-copy small{font-size:.8125rem}
body:not(.is-welcome) .page-heading{margin-bottom:24px}
.page-heading h1,#explorar .intro h1{font-weight:700;letter-spacing:-.045em;line-height:1.2}
.page-heading>p:last-child{line-height:1.65;max-width:760px}
.sidebar .nav-link.active{box-shadow:inset 3px 0 0 var(--theme-accent);border-color:var(--gui-edge)}
.sidebar .support-tools>.button{border-color:var(--gui-edge);box-shadow:none}
.top-link{border:1px solid var(--gui-edge);border-radius:10px;padding:9px 13px;color:var(--text);font-size:.8125rem;background:var(--theme-panel)}
.clarity-next{border:1px solid var(--gui-edge);border-radius:16px;margin-top:24px;padding:22px 24px;box-shadow:none}
.clarity-next .eyebrow{font-size:.6875rem;letter-spacing:.12em}
.clarity-next h2{font-size:1.125rem}.clarity-next-actions{margin-top:14px}
#explorar .catalog{border-radius:20px;padding:22px;background:color-mix(in srgb,var(--theme-panel) 62%,var(--theme-bg))}
.family-branch>summary{min-height:92px;padding:20px;gap:16px}
.branch-title{font-size:1.125rem}.branch-hint{font-size:.9375rem}.branch-preview{font-size:.8125rem}
.branch-symbol{flex-basis:46px;height:46px;border-radius:13px}.branch-count{font-size:.75rem}
.family-branch{border-radius:16px;box-shadow:none}.family-branch[open]>summary{border-radius:16px 16px 0 0}
.branch-options{padding:20px;margin-inline-start:22px}
html[data-theme] #copiloto .assistant-panel{padding:0;background:none;border:0;box-shadow:none;border-radius:0;gap:20px;align-items:start;max-width:none}
#copiloto .assistant-panel>.conversation-workspace{grid-column:1;grid-row:1;min-width:0;display:flex;flex-direction:column;gap:12px;padding:22px;border:1px solid var(--gui-edge);border-radius:20px;background:var(--gui-surface);box-shadow:var(--gui-shadow)}
#copiloto .assistant-panel>.avatar-companion{grid-column:2;grid-row:1;align-self:start}
#copiloto .assistant-heading{padding-bottom:14px}
#copiloto .assistant-mode{margin:0;padding:0 0 10px;gap:10px;border-color:var(--gui-edge)}
#copiloto .assistant-mode>span{font-size:.75rem;display:inline-flex;align-items:center;gap:6px}
#copiloto .assistant-mode>span:before{content:'';width:6px;height:6px;flex:none;border-radius:50%;background:var(--theme-accent)}
#copiloto .conversation-workspace>.messages{height:clamp(220px,28vh,300px);margin:0;padding:4px 4px 4px 0;scroll-padding:12px;overscroll-behavior:contain}
#copiloto .conversation-workspace>.messages:empty{height:220px}
#copiloto .msg{font-size:.9375rem;line-height:1.7;border-radius:14px;padding:14px 16px;margin-bottom:12px}
#copiloto .suggestions{flex-direction:row;flex-wrap:wrap;gap:7px}
#copiloto .suggestions button{flex:0 1 auto;border-radius:10px;min-height:40px;padding:8px 11px;font-size:.8125rem}
#copiloto .chat-form{margin:0;padding:8px 10px;border-radius:14px;background:var(--theme-bg)}
#copiloto .chat-form textarea{font-size:1rem;line-height:1.55;padding:8px;min-height:62px;max-height:180px;resize:vertical}
#copiloto .chat-bottom{margin:0;justify-content:space-between}
#copiloto .connect-beta{padding:12px 14px;font-size:.8125rem;box-shadow:none}
#copiloto .connect-beta summary{min-height:24px;cursor:pointer}
#copiloto .ai-options{margin:0;max-height:440px;overscroll-behavior:contain}
#copiloto .avatar-companion{padding:14px;border-radius:20px}
#copiloto .avatar-stage{height:320px;margin:12px 0}
#copiloto .avatar-status,#copiloto .avatar-help{font-size:.8125rem;line-height:1.6}
#copiloto .avatar-controls{gap:10px}
#copiloto .avatar-topline button{font-size:.8125rem;min-height:36px;padding:6px 10px}
:is(.clarity-stop,.nav-link,.top-link,.catalog-tabs button):focus-visible{outline:2px solid var(--theme-accent);outline-offset:3px}
@media(min-width:1201px){#copiloto .assistant-panel{grid-template-columns:minmax(0,1fr) 320px}}
@media(min-width:791px) and (max-width:1200px){#copiloto .assistant-panel{grid-template-columns:minmax(0,1fr) 280px}}
@media(min-width:791px) and (max-width:1100px){.sidebar .clarity-nav-title,.sidebar .clarity-nav-group{display:none}.sidebar .nav-link{gap:0}}
@media(max-width:790px){
 .clarity-route{margin-bottom:20px}.clarity-route ol{gap:6px}
 .clarity-route .clarity-stop{flex-direction:column;gap:8px;padding:10px;min-height:92px;align-items:flex-start;border-radius:12px}
 .clarity-number{width:26px;height:26px;border-radius:8px;font-size:.6875rem}
 .clarity-stop-copy b{font-size:.8125rem}.clarity-stop-copy small{display:none}
 body:not(.is-welcome) .page-heading{margin-bottom:20px}.page-heading h1{font-size:clamp(1.6rem,6vw,2.1rem)}
 #copiloto .assistant-panel{display:flex;gap:18px!important}
 #copiloto .assistant-panel>.conversation-workspace{width:100%;padding:16px;gap:12px;border-radius:16px}
 #copiloto .assistant-panel>.avatar-companion{order:2;width:100%;border-radius:16px}
 #copiloto .conversation-workspace>.messages{height:clamp(210px,34vh,300px)}
 #copiloto .chat-form textarea{font-size:1rem;min-height:62px}
 #copiloto .suggestions button{flex:1 1 120px;min-height:44px;text-align:left}
 #copiloto .avatar-stage{height:320px;max-width:440px;margin-inline:auto}
 #copiloto .ai-options{max-height:none}
 #explorar .catalog{padding:14px;border-radius:16px}
 .family-branch>summary{padding:16px 12px;gap:10px;min-height:100px;grid-template-columns:42px minmax(0,1fr) 18px}
 .branch-title{font-size:1.0625rem}.branch-hint{font-size:.875rem}.branch-options{padding:14px 10px;margin-inline-start:12px}
 .clarity-next{padding:18px;border-radius:14px}.clarity-next-actions .button{min-height:44px}
 .sidebar .nav-link.active{box-shadow:inset 0 -2px 0 var(--theme-accent)}
 .sidebar .clarity-nav-title{font-size:.75rem;overflow-wrap:normal;word-break:normal;line-height:1.4}
 .sidebar .nav-link{min-height:58px;gap:4px}
}
@media(max-width:390px){.clarity-route .clarity-stop{padding:9px 7px}.clarity-stop-copy b{font-size:.75rem}#copiloto .assistant-panel>.conversation-workspace{padding:14px}#copiloto .msg{padding:12px}.sidebar .nav-link{padding-inline:3px}}
@media(prefers-reduced-motion:reduce){.clarity-route .clarity-stop{transition:none}}
.reduce-motion .clarity-route .clarity-stop,html[data-performance=light] .clarity-route .clarity-stop{transition:none}