/* RC37 · referencias individuales en diseno-rc37/referencia.png.
   La composición conserva estados, preferencias y permisos existentes. */
html body{--cm-radius:14px;--cm-shadow:0 2px 12px #123b2910}
html[data-theme=yvyra_deep][data-mode=light] body{--bg:#f7f8f3;--surface:#fff;--surface-2:#f4f7f4;--surface-3:#e4f4eb;--line:#e3e9e5;--text:#103c35;--muted:#61716c;--brand:#08765c;--brand-2:#075a47;--on-brand:#fff;background:var(--bg);color:var(--text)}
html body :is(.topbar,.market-header,.business-header,.admin-header){min-height:72px}
html body :is(.primary,.button.primary){background:var(--brand);color:var(--on-brand);border:1px solid transparent;box-shadow:none;border-radius:10px;min-height:44px}
html body :is(.left-rail,.app-rail){background:var(--surface);border-right:1px solid var(--line)}
html body :is(.rail-link.is-active,.app-rail .is-active){background:var(--surface-3);color:var(--brand);border-radius:10px}
html body .ikatu-brand-host>span{background:transparent!important;color:inherit}
/* Inicio: saludo, accesos y mercadito, en el mismo orden del mockup. */
html body #feedView .cm-home{max-width:1040px;padding:24px}
html body #feedView .home-welcome{display:flex;justify-content:space-between;gap:16px;margin:0 0 22px}
html body #feedView .home-welcome h2{font-size:30px;margin:0 0 4px}
html body #feedView .home-welcome p{font-size:21px;font-weight:600;color:var(--text);margin:0}
html body #feedView .home-welcome .home-hero-action{width:52px;height:52px;min-width:52px;min-height:52px;border-radius:50%;margin:0;padding:0;background:var(--brand);color:var(--on-brand);font-size:32px;border:0}
html body #feedView .cm-services{grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-bottom:18px}
html body #feedView .cm-services a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;text-align:center;background:var(--surface-2);border:0;border-radius:16px;padding:18px 8px;min-width:0}
html body #feedView .cm-services strong{font-size:14px}
html body #feedView .cm-services small{font-size:12px}
html body #feedView .home-market-banner{display:block;position:relative;border-radius:14px;overflow:hidden;min-height:260px;text-decoration:none;background:#173e30;color:#fff}
html body #feedView .home-market-banner img{position:absolute;width:100%;height:100%;inset:0;object-fit:cover;object-position:center}
html body #feedView .home-market-banner:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#082719da,#08271915)}
html body #feedView .home-market-banner div{position:relative;z-index:1;padding:36px;max-width:430px}
html body #feedView .home-market-banner strong{font-size:30px;line-height:1.15;display:block;margin:16px 0}
html body #feedView .home-market-banner span{display:block;max-width:280px;font-size:15px;line-height:1.5}
/* Comprar y Mi lista. */
html body[data-ikatu-app=mercadito] .catalog-product{border-radius:12px;padding:0 0 10px;overflow:hidden;gap:8px;box-shadow:0 2px 8px #123b2908}
html body[data-ikatu-app=mercadito] .catalog-product>div:not(.product-visual){padding-inline:10px}
html body[data-ikatu-app=mercadito] .catalog-product>.product-visual{border-radius:0;background:var(--surface-2);width:100%}
html body[data-ikatu-app=mercadito] .catalog-product .product-visual img{border-radius:0;width:100%;max-height:200px;object-fit:contain}
html body[data-ikatu-app=mercadito] .catalog-product>button{margin:0 10px}
html body[data-ikatu-app=mercadito] .catalog-product h2{font-size:16px;letter-spacing:-.025em}
html body[data-ikatu-app=mercadito] .catalog-price{font-size:17px;color:var(--text)}
html body[data-ikatu-app=mercadito] .catalog-product p{font-size:12px;margin:4px 0}
html body[data-ikatu-app=mercadito] .catalog-product small{color:var(--muted);font-size:11px}
html body[data-ikatu-app=mercadito] .list-item{background:var(--surface);border:0;border-bottom:1px solid var(--line);border-radius:0;padding:14px 8px;box-shadow:none}
html body[data-ikatu-app=mercadito] .notebook-section{background:var(--surface);border-radius:12px;padding:8px}
html body[data-ikatu-app=mercadito] .line-label{background:transparent;border-color:transparent;font-weight:650}
html body[data-ikatu-app=mercadito] .stock-row{background:var(--surface);border:0;border-bottom:1px solid var(--line);border-radius:0;padding:16px 12px}
/* Negocios: pedidos en tarjetas, acciones de ancho cómodo. */
html body[data-ikatu-app=negocios] :is(.request-feed,.organization-grid article){border:1px solid var(--line);border-radius:14px;box-shadow:none;background:var(--surface)}
html body[data-ikatu-app=negocios] #requestFeedRows article{padding:20px;border:1px solid var(--line);border-radius:12px;margin:12px 0;background:var(--surface)}
html body[data-ikatu-app=negocios] .request-actions .primary{padding:12px 18px;text-align:center}
/* Mi Ikatu: identidad primero, accesos cotidianos después. */
html body #profileView{max-width:980px;margin-inline:auto;padding:28px}
html body #profileView .page-heading{padding:0;margin:0 0 24px}
html body #profileView h1{font-size:32px;margin:6px 0}
html body #profileView .profile-identity{display:flex;align-items:center;gap:16px;border:1px solid var(--line);background:var(--surface);border-radius:16px;padding:22px;margin-bottom:22px}
html body #profileView .profile-avatar{width:58px;height:58px;display:grid;place-items:center;border-radius:50%;background:var(--surface-3);color:var(--brand);font-size:22px;font-weight:700;flex-shrink:0}
html body #profileView .profile-identity strong{font-size:20px}
html body #profileView .profile-identity p{margin:4px 0 0;color:var(--muted)}
html body #profileView .profile-grid{display:grid;grid-template-columns:1fr 1fr;gap:0;border:1px solid var(--line);background:var(--surface);border-radius:14px;overflow:hidden;margin-bottom:24px}
html body #profileView .profile-card{position:relative;display:grid;grid-template-columns:36px 1fr;gap:4px 12px;border:0;border-bottom:1px solid var(--line);border-radius:0;background:transparent;padding:20px 32px 20px 18px;box-shadow:none;text-decoration:none;color:var(--text);text-align:left;min-height:96px}
html body #profileView .profile-card:after{content:'›';position:absolute;right:16px;top:30px;color:var(--muted)}
html body #profileView .profile-card>span{grid-row:1/3;align-self:center;font-size:24px;color:var(--brand)}
html body #profileView .profile-card strong{font-size:15px}
html body #profileView .profile-card p{grid-column:2;font-size:13px;margin:0;color:var(--muted)}
html body #profileView .profile-card:hover{background:var(--surface-2)}
html body #profileView .account-panel{border-radius:14px;box-shadow:none;border:1px solid var(--line);background:var(--surface)}
/* Acceder: marca y bienvenida serenas, formulario como acción central. */
html body.auth-body{background:var(--bg);padding:36px 20px;min-height:100dvh}
html body .auth-shell{max-width:1020px;min-height:620px;border-radius:20px;box-shadow:0 12px 48px #123b290a}
html body .auth-brand-panel{background:var(--surface-2);color:var(--text);padding:48px;border-right:1px solid var(--line)}
html body .auth-brand-panel h1{font-size:clamp(30px,3.4vw,44px);max-width:360px;line-height:1.12}
html body .auth-brand-panel>small{color:var(--brand);font-size:14px;opacity:1}
html body .auth-form-panel{padding:40px}
html body .auth-form-panel h2{font-size:28px;margin:8px 0}
html body .auth-form input{min-height:48px;background:var(--surface);border-radius:9px}
html body .auth-submit{width:100%;min-height:48px}
html body .auth-note{font-size:14px;line-height:1.5;color:var(--muted)}
/* Reparto utiliza contraste oscuro independientemente de la vista comercial. */
html body.driver-workspace{--bg:#1e282b;--surface:#273337;--surface-2:#2c3b3e;--surface-3:#344a49;--line:#435457;--text:#f1f7f5;--muted:#bdcdca;--brand:#a7f3dd;--on-brand:#103c35;color:var(--text);background:var(--bg)}
html body.driver-workspace :is(.driver-day-summary,.driver-coordination,.driver-available,.driver-active,.role-tools a){background:var(--surface);color:var(--text);border:1px solid var(--line);border-radius:14px}
html body.driver-workspace :is(input,select,textarea){color-scheme:dark}
@media(max-width:700px){
 html body :is(.topbar,.market-header,.business-header,.admin-header){padding-inline:16px;min-height:64px}
 html body #feedView .cm-home{padding:18px 16px}
 html body #feedView .home-welcome h2{font-size:27px}
 html body #feedView .home-welcome p{font-size:20px}
 html body #feedView .cm-services{gap:7px}
 html body #feedView .cm-services a{padding:16px 4px}
 html body #feedView .cm-services strong{font-size:12px}
 html body #feedView .cm-services small{font-size:10px}
 html body #feedView .home-market-banner{min-height:230px}
 html body #feedView .home-market-banner div{padding:24px;max-width:310px}
 html body #feedView .home-market-banner strong{font-size:26px}
 html body[data-ikatu-app=mercadito] .visual-products{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
 html body[data-ikatu-app=mercadito] .catalog-scroll{padding:12px}
 html body[data-ikatu-app=mercadito] .catalog-product .product-visual img{max-height:160px}
 html body[data-ikatu-app=negocios] #requestFeedRows article{display:block}
 html body[data-ikatu-app=negocios] .request-actions{display:flex;flex-direction:column;margin-top:12px}
 html body #profileView{padding:20px 16px 100px}
 html body #profileView .profile-grid{grid-template-columns:1fr}
 html body #profileView .profile-card{min-height:82px;padding-block:16px}
 html body #profileView .profile-identity{padding:18px}
 html body.auth-body{padding:0}
 html body .auth-shell{min-height:100dvh;border-radius:0;grid-template-columns:1fr}
 html body .auth-brand-panel{min-height:230px;padding:28px 24px;gap:22px;border-right:0;border-bottom:1px solid var(--line)}
 html body .auth-brand-panel h1{font-size:32px;margin:0 0 10px}
 html body .auth-brand-panel .eyebrow{display:none}
 html body .auth-form-panel{padding:28px 24px 40px}
}
@media(prefers-reduced-motion:reduce){html body *{scroll-behavior:auto}}
/* Estados operativos · segunda referencia ImageGen, revisada por pantalla. */
html body #intakeDialog .quote-line{border:1px solid var(--line);border-radius:12px;padding:16px;margin:14px 0;background:var(--surface)}
html body #intakeDialog .quote-line legend{padding:0 8px;font-size:16px;font-weight:700}
html body #intakeDialog .quote-line-summary{display:flex;flex-wrap:wrap;align-items:center;gap:12px;justify-content:space-between}
html body #intakeDialog .quote-line-summary .check-row{color:var(--brand);font-size:14px}
html body #intakeDialog .quote-edit{margin-top:16px;padding:14px;border-radius:10px;background:var(--surface-2)}
html body #intakeDialog #sendProposal{width:100%;min-height:48px;margin-top:18px}
html body #intakeDialog #quoteSummary{background:var(--surface-3);border-radius:12px;padding:16px;font-weight:650}
html body #productDetails{border:1px solid var(--line);border-radius:12px;background:var(--surface);margin:16px 0}
html body #productDetails>summary{background:var(--brand);color:var(--on-brand);border-radius:10px;padding:14px 18px;font-weight:650;cursor:pointer}
html body #productForm .publish-section{border:0;background:var(--surface);padding:14px}
html body #productForm .publish-photo-picker{border:1px dashed var(--line);border-radius:12px;background:var(--surface-2);padding:18px}
html body #productForm .publish-footer{border-top:1px solid var(--line);background:var(--surface);padding:16px}
html body #businessCatalogSection .business-catalog-browser{border:1px solid var(--line);border-radius:12px;background:var(--surface);padding:16px}
html body .order-sent-confirmation{top:84px;padding:24px;width:min(390px,calc(100% - 32px));background:var(--surface);color:var(--text);border:1px solid var(--line);border-radius:18px;box-shadow:0 12px 48px #123b2933;text-align:center}
html body .order-sent-confirmation:before{content:'✓';display:grid;place-items:center;width:64px;height:64px;border-radius:50%;background:var(--brand);color:var(--on-brand);margin:0 auto 16px;font-size:34px}
html body .order-sent-confirmation strong{display:block;font-size:24px}
html body .order-sent-confirmation span{font-size:15px;color:var(--muted);line-height:1.5;margin:12px 0 20px}
html body .order-sent-confirmation button{position:static;width:100%;background:var(--brand);color:var(--on-brand);border:0;border-radius:10px;min-height:46px;font-size:15px;font-weight:700}
html body.transfer-workspace .admin-main[data-transfers]:not([data-transfers='']){max-width:900px;margin:auto}
html body.transfer-workspace .transfer-order{border:1px solid var(--line);border-radius:16px;background:var(--surface);padding:24px}
html body.transfer-workspace .transfer-total{background:var(--surface-2);border:1px solid var(--line);border-radius:12px;padding:20px;gap:12px}
html body.transfer-workspace .transfer-total strong{border-top:1px solid var(--line);padding-top:12px;font-size:23px}
html body.transfer-workspace .transfer-total small{align-self:end;text-align:right;color:var(--muted)}
html body.transfer-workspace .transfer-legs{gap:20px;margin:20px 0}
html body.transfer-workspace .transfer-legs>article{border:1px solid var(--line);border-radius:12px;padding:18px}
html body.transfer-workspace .transfer-legs dl{padding:16px;background:var(--surface-3);border-radius:12px}
html body.transfer-workspace input[type=file]{padding:24px 12px;border:1px dashed var(--line);border-radius:12px;background:var(--surface-2);width:100%}
html body.transfer-workspace .transfer-state{background:var(--surface-2);border-radius:10px;padding:12px;font-size:14px}
html body.order-room-page .order-room-grid>div>section{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:20px;margin-bottom:16px}
@media(max-width:700px){html body.transfer-workspace .transfer-order{padding:16px}html body.transfer-workspace .transfer-legs{grid-template-columns:1fr}html body #productForm .publish-layout{grid-template-columns:1fr}html body #intakeDialog .quote-line-summary{gap:8px}}
/* Correcciones detectadas en revisión visual: límites del acceso y contraste oscuro. */
html body.auth-body .auth-shell{width:min(1020px,100%)!important;max-width:1020px!important;grid-template-columns:repeat(2,minmax(0,1fr));margin-inline:auto;box-sizing:border-box}
html body.auth-body :is(.auth-brand-panel,.auth-form-panel){min-width:0;box-sizing:border-box}
html[data-mode=dark] body.auth-body .auth-brand-panel{color:var(--text)}
html body.auth-body .auth-brand-panel h1{color:var(--text)}
html body.auth-body .auth-form input{width:100%;min-width:0;box-sizing:border-box}
html body.auth-body .charm-badge{display:none}
@media(max-width:700px){html body.auth-body .auth-shell{grid-template-columns:minmax(0,1fr)}}

html body #feedView .cm-services a:after{content:none}
html body #feedView .cm-services svg{background:transparent;padding:0;border-radius:0}

/* Acceso compacto y sin lemas decorativos añadidos. */
html body.auth-body .ikatu-charm-tag{display:none}
@media(max-width:700px){html body.auth-body .auth-shell{align-content:start;grid-template-rows:auto auto}}