/* Isolated mobile concept. Applies only while the new preview screen is present. */
.sm-preview{display:grid;grid-template-columns:minmax(230px,360px) minmax(0,460px);gap:clamp(24px,5vw,80px);justify-content:center;align-items:start;padding:28px 0;color:#312b26}
.sm-preview *{box-sizing:border-box}.sm-desktop-note{position:sticky;top:28px;padding:36px 12px}.sm-desktop-note h2{font:38px/1.2 Georgia,serif;margin:16px 0}.sm-desktop-note p{line-height:1.7;color:#666152}.sm-desktop-note .button{margin-top:20px}
.sm-device{position:relative;width:100%;max-width:460px;overflow:hidden;background:#fbf5eb;border:1px solid #dfd3c1;border-radius:30px;box-shadow:0 20px 70px #4d35241c}
.sm-header{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:23px 22px 18px;border-bottom:1px solid #e8ddcc}.sm-header>span:first-child{font:24px Georgia,serif;color:#63302b;letter-spacing:.08em}.sm-header small{display:block;font:10px/1.5 system-ui,sans-serif;color:#706758;letter-spacing:0}.sm-preview-tag{font:700 9px system-ui,sans-serif;letter-spacing:.08em;padding:7px 8px;background:#eee4d5;border-radius:6px;white-space:nowrap}
.sm-content{padding:24px 20px}.sm-intro{text-align:center}.sm-eyebrow{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.13em;color:#766744}.sm-intro h1{font:38px/1.08 Georgia,serif;color:#622b28;margin:12px 0;text-transform:uppercase;letter-spacing:.015em}.sm-ornament{color:#a68e55}.sm-intro>p:last-child{font-size:13px;line-height:1.7;color:#696254;margin:12px 0 22px}.sm-reference{text-align:center;font-size:11px;color:#6b614e;line-height:1.6}.sm-guide-link{display:flex;justify-content:space-between;width:100%;border:0;border-block:1px solid #e2d6c3;background:none;text-align:left;padding:15px 0;color:#514a37;font:600 12px system-ui,sans-serif;margin:18px 0}
.sm-preview [data-status="VERDE"]{--sm-color:#48732d;--sm-bg:#f1f5e8;--sm-ink:#29451b}.sm-preview [data-status="AMARELO"]{--sm-color:#b87b00;--sm-bg:#fff3d9;--sm-ink:#6c4800}.sm-preview [data-status="VERMELHO"]{--sm-color:#b32b2e;--sm-bg:#fcebe6;--sm-ink:#882024}.sm-preview [data-status="CONCIERGE"]{--sm-color:#245fa4;--sm-bg:#eaf1fa;--sm-ink:#194876}
.sm-filter{display:flex;flex-wrap:wrap;gap:8px;margin:20px 0}.sm-filter button{display:flex;align-items:center;gap:6px;min-height:44px;border:1px solid #d3c7b3;border-radius:24px;background:#fffcf7;color:#514a3e;padding:9px 11px;font:600 11px system-ui,sans-serif}.sm-filter button[aria-pressed="true"]{background:#353f2d;color:white;border-color:#353f2d}.sm-filter button[data-status][aria-pressed="true"]{background:var(--sm-bg);color:var(--sm-ink);border:2px solid var(--sm-color)}.sm-filter b{font-size:10px}.sm-filter i,.sm-state i,.sm-guide h3 i{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--sm-color);flex-shrink:0}
.sm-section-title{font:24px/1.3 Georgia,serif;margin:22px 0 15px;color:#4b3f32}.sm-care-list{display:grid;gap:14px}.sm-care,.sm-guide{display:grid;grid-template-columns:70px minmax(0,1fr);gap:14px;background:var(--sm-bg);border:1px solid #dacdb8;border-left:4px solid var(--sm-color);border-radius:15px;padding:18px 14px;box-shadow:0 3px 12px #5c422408}.sm-ring{position:relative;display:grid;place-items:center;width:68px;height:68px;border:5px solid var(--sm-color);border-radius:50%;color:var(--sm-color);background:#fffcf6}.sm-ring svg{width:46px;height:46px;color:#ab955e}.sm-ring b{position:absolute;right:-5px;bottom:-3px;display:grid;place-items:center;width:23px;height:23px;border:2px solid #fffcf6;border-radius:50%;background:var(--sm-color);color:white;font:bold 14px system-ui,sans-serif}
.sm-state{display:inline-flex;align-items:center;gap:6px;color:var(--sm-ink);font:750 11px/1.5 system-ui,sans-serif;text-transform:uppercase;letter-spacing:.015em}.sm-care h3,.sm-guide h3{font:700 15px/1.45 system-ui,sans-serif;color:#352e28;margin:7px 0}.sm-care p,.sm-guide p,.sm-detail p{font-size:12px;line-height:1.7;color:#554d40;margin:8px 0}.sm-care small{display:block;font-size:11px;color:#675b48;margin:10px 0}.sm-care button{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;min-height:44px;border:0;border-top:1px solid #d9ccb6;background:none;color:var(--sm-ink);padding:11px 0 0;font:700 12px system-ui,sans-serif;text-align:left}.sm-guide{align-items:center}.sm-guide h3{display:flex;align-items:center;gap:8px;text-transform:uppercase;margin:0}.sm-guide p{margin-bottom:0}
.sm-bottom{position:relative;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));padding:10px 10px calc(10px + env(safe-area-inset-bottom));background:#fffcf6;border-top:1px solid #ded1bc;z-index:5}.sm-bottom button{display:grid;place-items:center;gap:4px;border:0;background:none;color:#716450;min-height:48px;font:600 10px system-ui,sans-serif;padding:5px}.sm-bottom button>span{font-size:21px}.sm-bottom [aria-current="page"]{background:#eaf0df;color:#3d5c2a;border-radius:12px}
.sm-footnote{font-size:10px;line-height:1.7;color:#756a58;text-align:center;margin:24px 0 6px}.sm-example,.sm-information{border:1px solid #d5c7ac;border-radius:12px;padding:12px;background:#fffaf0;font-size:12px;line-height:1.6;color:#665337}.sm-example-toggle,.sm-back{display:block;min-height:44px;border:0;background:none;color:#665131;text-decoration:underline;text-underline-offset:4px;font:600 12px system-ui,sans-serif}.sm-example-toggle{margin:16px auto 0}.sm-empty{text-align:center;border:1px solid #ded2bf;border-radius:18px;padding:24px 18px;background:#fffaf3}.sm-empty>svg{width:70px;height:70px;color:#ad9255}.sm-empty h2{font:25px/1.3 Georgia,serif}.sm-empty p{font-size:13px;line-height:1.7;color:#675f50}.sm-primary{display:block;width:100%;min-height:48px;border:1px solid #3f5f2c;border-radius:12px;background:#3f5f2c;color:white;padding:13px 15px;font:700 13px system-ui,sans-serif}
.sm-detail{padding:22px;background:var(--sm-bg);border:1px solid var(--sm-color);border-radius:18px;margin-top:16px}.sm-detail>.sm-ring{margin:0 auto 20px}.sm-detail h2{font:28px/1.25 Georgia,serif;color:var(--sm-ink);margin:12px 0}.sm-detail dl>div{padding:14px 0;border-top:1px solid #d7cab6}.sm-detail dt{font-size:11px;color:#6b604e}.sm-detail dd{margin:6px 0 0;font-size:14px;font-weight:700}.sm-preview button:focus-visible{outline:3px solid #175cd3;outline-offset:4px}
@media(max-width:767px){.sm-preview{display:block;padding:0}.sm-desktop-note{display:none}.sm-device{max-width:none;border:0;border-radius:0;box-shadow:none;overflow:visible}.sm-content{padding:24px 18px 110px}.sm-bottom{position:fixed;bottom:0;left:0;right:0}.main-content:has(.sm-preview){padding-inline:0;padding-bottom:0;background:#fbf5eb}.main-content:has(.sm-preview)>.demo-ribbon{padding-inline:18px}.main-content:has(.sm-preview)>.app-topbar{margin-inline:0}.sm-header{padding:20px 18px}.sm-intro h1{font-size:36px}}
@media(max-width:360px){.sm-care,.sm-guide{grid-template-columns:58px minmax(0,1fr);gap:10px;padding:16px 10px}.sm-ring{width:56px;height:56px;border-width:4px}.sm-ring svg{width:38px;height:38px}}
@media(max-width:767px){.integrated-shell:has(.sm-preview)>.sidebar-nav{display:none}.main-content:has(.sm-preview)>.demo-ribbon{margin:0;padding:10px 18px}.main-content:has(.sm-preview)>.app-topbar{margin:0}}
.sm-intro h1{font-size:clamp(24px,7.4vw,32px)}
.sm-preview [data-status="AMARELO"] .sm-ring b{background:#ffd326;color:#3d2c00}
.sm-user{display:flex;align-items:center;gap:10px;padding:16px 20px;border-bottom:1px solid #e1d5c2;background:#f3ebdd}
.sm-user-avatar{display:grid;place-items:center;flex:0 0 40px;width:40px;height:40px;border-radius:50%;background:#e1ead7;color:#365324;border:1px solid #bccdab;font:700 14px system-ui,sans-serif}
.sm-user>div{display:grid;gap:4px;flex:1;min-width:0}.sm-user small{font:10px/1.5 system-ui,sans-serif;color:#665a46}.sm-user strong{font:700 14px/1.4 system-ui,sans-serif;color:#3c342a;overflow-wrap:anywhere}.sm-user>div>span{font:11px/1.5 system-ui,sans-serif;color:#665a46;overflow-wrap:anywhere}
.sm-user>button{display:flex;align-items:center;justify-content:center;gap:5px;flex-shrink:0;min-height:44px;padding:9px 10px;border:1px solid #cdbda4;border-radius:10px;background:#fffcf7;color:#614638;font:600 12px system-ui,sans-serif}
@media(max-width:360px){.sm-user{padding:14px 12px;gap:8px}.sm-user-avatar{flex-basis:34px;width:34px;height:34px}}