*{box-sizing:border-box}html{scroll-behavior:smooth;color-scheme:dark}body{margin:0;background:var(--valenne-bg-0);color:var(--valenne-text);font-family:var(--font-body);font-size:15px;line-height:1.55}button,input,select{font:inherit;color:inherit}button,a,select{cursor:pointer}button{border:0}a{color:inherit;text-decoration:none}:focus-visible{outline:0;box-shadow:var(--focus-ring)}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.skip{position:fixed;left:1rem;top:-4rem;z-index:200;background:var(--valenne-text);color:var(--valenne-bg-0);padding:.7rem 1rem;border-radius:var(--radius-sm)}.skip:focus{top:1rem}.lab-shell{min-height:100vh}.sidebar{position:fixed;inset:0 auto 0 0;z-index:var(--z-nav);width:250px;padding:28px 18px 20px;background:linear-gradient(180deg,#110c0f 0%,#090708 100%);border-right:var(--border-subtle);display:flex;flex-direction:column}.brand{display:inline-flex;align-items:center;gap:12px}.brand img{width:42px;height:42px;filter:drop-shadow(0 0 10px rgb(184 41 70/.16))}.brand__words{display:inline-flex;flex-direction:column;text-align:center;line-height:1}.brand__words b{font-family:var(--font-brand);font-size:20px;letter-spacing:.09em}.brand__words small{margin-top:5px;color:var(--valenne-accent);font:600 8px/1 var(--font-ui);letter-spacing:.34em;padding-left:.34em}.brand--sidebar{padding:0 12px 28px}.sidebar nav{display:grid;gap:4px}.nav-item{position:relative;display:flex;align-items:center;gap:12px;min-height:46px;padding:0 14px;color:var(--valenne-muted);border-radius:var(--radius-md);transition:background var(--duration-base),color var(--duration-base),transform var(--duration-fast)}.nav-item i{width:20px;font-style:normal;text-align:center;color:#766a6e}.nav-item:hover{background:rgb(255 255 255/.035);color:var(--valenne-text-secondary)}.nav-item.active{background:linear-gradient(90deg,#2a1a20,#1c1518);color:#fff;box-shadow:var(--shadow-sm),var(--glow-accent)}.nav-item.active:before{content:"";position:absolute;left:0;width:3px;height:22px;border-radius:0 3px 3px 0;background:var(--valenne-pink)}.nav-item.active i{color:var(--valenne-pink)}.nav-item:active{transform:scale(.985)}.sidebar__meta{margin-top:auto;display:flex;align-items:center;justify-content:space-between;padding:0 10px;color:var(--valenne-muted)}main{min-height:100vh;margin-left:250px;padding:0 clamp(22px,4vw,64px) 80px;background:radial-gradient(circle at 80% -20%,rgb(184 41 70/.09),transparent 32%),var(--valenne-bg-0)}.topbar{position:sticky;top:0;z-index:var(--z-header);min-height:92px;display:flex;align-items:center;gap:20px;justify-content:space-between;background:linear-gradient(var(--valenne-bg-0) 65%,transparent);backdrop-filter:blur(12px)}h1,h2,h3,h4,p{margin-top:0}.topbar h1{font:400 25px/1.1 var(--font-heading);margin:3px 0 0}.eyebrow{margin-bottom:5px;color:var(--valenne-accent);font:650 10px/1.2 var(--font-ui);letter-spacing:.22em}.toolbar{display:flex;align-items:center;gap:9px}.select-wrap select{height:40px;padding:0 34px 0 13px;border:var(--border-subtle);border-radius:var(--radius-sm);background:var(--valenne-surface);color:var(--valenne-text-secondary)}.icon-button{width:40px;height:40px;border-radius:var(--radius-sm);border:var(--border-subtle);background:var(--valenne-surface);display:inline-grid;place-items:center;transition:.2s}.icon-button:hover{background:var(--valenne-surface-hover);color:var(--valenne-accent)}.notice{padding:12px 16px;border:1px solid rgb(228 129 145/.2);border-radius:var(--radius-md);background:rgb(184 41 70/.08);color:var(--valenne-text-secondary);font-size:13px}.notice strong{color:var(--valenne-accent)}.page{display:none;max-width:1480px;margin:0 auto}.page.active{display:block;animation:enter .35s var(--ease-standard)}@keyframes enter{from{opacity:0;transform:translateY(5px)}}.section-heading{display:flex;justify-content:space-between;align-items:flex-start;gap:20px;padding:56px 0 26px}.section-heading h2{font:400 clamp(30px,4vw,50px)/1.08 var(--font-heading);letter-spacing:-.025em;margin-bottom:10px}.section-heading p:not(.eyebrow){color:var(--valenne-muted);margin:0}.status{display:inline-flex;align-items:center;white-space:nowrap;border-radius:var(--radius-pill);padding:5px 8px;font:700 8px/1 var(--font-ui);letter-spacing:.13em}.status--draft{color:#d7cbd0;background:#282126}.status--candidate{color:#ffc4d0;background:#4b1c29}.status--approved{color:#96ebbd;background:#163528}.status--discarded{color:#aaa0a3;background:#201d1e;text-decoration:line-through}.spec-card{padding:24px;margin-bottom:18px;border:var(--border-subtle);border-radius:var(--radius-xl);background:linear-gradient(145deg,rgb(255 255 255/.026),transparent),var(--valenne-bg-1);box-shadow:var(--shadow-sm)}.card-heading{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:22px}.card-heading h3{margin:0;font:400 22px/1.2 var(--font-heading)}.grid{display:grid;gap:18px}.grid--2{grid-template-columns:1fr 1fr}.logo-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:12px}.logo-tile{min-height:150px;display:grid;place-items:center;padding:18px 10px;border:var(--border-subtle);border-radius:var(--radius-lg);background:#0b0809}.logo-tile .brand{flex-direction:column}.logo-tile .brand img{width:48px;height:48px}.logo-tile .brand__words b{font-size:18px}.logo-tile>small{align-self:end;color:var(--valenne-muted);font-size:10px}.logo-tile--icon .brand img{width:62px;height:62px}.swatches{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.swatch{height:92px;border-radius:var(--radius-md);border:1px solid rgb(255 255 255/.08);padding:12px;display:flex;flex-direction:column;justify-content:flex-end;text-shadow:0 1px 3px #000}.swatch b{font-size:11px}.swatch small{font:10px var(--font-mono);opacity:.75}.type-sample{display:grid;gap:7px}.type-sample>span,.type-sample code{color:var(--valenne-muted);font-size:11px}.type-sample strong{font:400 38px var(--font-brand);letter-spacing:.08em}.type-sample h4{font:400 26px var(--font-heading);margin:0}.type-sample p{margin:0;color:var(--valenne-text-secondary)}.component-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}.demo{display:flex;flex-direction:column;align-items:flex-start;gap:12px}.demo__label{font-size:11px;color:var(--valenne-muted);margin-bottom:3px}.button{min-height:42px;padding:0 18px;border-radius:var(--radius-md);font-weight:650;transition:transform var(--duration-fast),background var(--duration-base),box-shadow var(--duration-base)}.button:active{transform:scale(.98)}.button--primary{background:linear-gradient(135deg,#c73a58,#9e233d);color:#fff;box-shadow:0 8px 24px rgb(184 41 70/.18)}.button--primary:hover{background:linear-gradient(135deg,#d74b68,#ad2944);box-shadow:0 10px 28px rgb(184 41 70/.25)}.button--secondary{background:transparent;border:1px solid #584149;color:var(--valenne-text-secondary)}.button--secondary:hover{background:var(--valenne-surface-hover);border-color:#77515d}.field{width:100%;display:grid;gap:5px;color:var(--valenne-text-secondary);font-size:11px}.field input,.field select{width:100%;height:43px;padding:0 12px;border:1px solid #433238;border-radius:var(--radius-sm);background:#100c0e;font-size:13px}.field input::placeholder{color:#73676a}.field input:focus,.field select:focus{outline:0;border-color:var(--valenne-pink);box-shadow:0 0 0 3px rgb(216 91 118/.12)}.field--search{position:relative}.field--search i{position:absolute;right:12px;bottom:11px;color:var(--valenne-muted)}.check,.toggle{display:flex;gap:9px;align-items:center;color:var(--valenne-text-secondary);font-size:12px}.check input{accent-color:var(--valenne-pink);width:17px;height:17px}.toggle input{position:absolute;opacity:0}.toggle i{position:relative;width:38px;height:22px;border-radius:20px;background:#392d31}.toggle i:after{content:"";position:absolute;width:16px;height:16px;left:3px;top:3px;border-radius:50%;background:#a99da0;transition:.2s}.toggle input:checked+i{background:var(--valenne-red)}.toggle input:checked+i:after{left:19px;background:#fff}.chips{display:flex;flex-wrap:wrap;gap:7px}.chip{padding:7px 11px;border-radius:var(--radius-pill);background:#161113;color:var(--valenne-muted);border:var(--border-subtle);font-size:11px}.chip.active{background:#3c1923;color:#ffd9e1;border-color:#662438}.progress{height:4px;min-width:150px;flex:1;border-radius:8px;background:#392f32;overflow:hidden}.progress i{display:block;height:100%;border-radius:8px;background:linear-gradient(90deg,var(--valenne-red),var(--valenne-accent))}.spinner{width:27px;height:27px;border:2px solid #423438;border-top-color:var(--valenne-pink);border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(1turn)}}.skeleton{width:100%;height:55px;border-radius:var(--radius-md);background:linear-gradient(90deg,#151012 25%,#21191c 45%,#151012 65%);background-size:250% 100%;animation:shimmer 1.4s infinite}@keyframes shimmer{to{background-position:-250% 0}}.feedback-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.empty-state,.message,.toast{min-height:150px;padding:20px;border:var(--border-subtle);border-radius:var(--radius-lg);background:#100c0e;display:flex;flex-direction:column;gap:8px;align-items:flex-start;justify-content:center}.empty-state i{font-size:30px;color:var(--valenne-pink)}.empty-state span,.message span{color:var(--valenne-muted);font-size:12px}.message--error{border-color:rgb(238 107 117/.26)}.message--error b{color:#ffadb4}.message--success{border-color:rgb(88 201 148/.22)}.message--success b{color:#8be0b4}.toast{min-height:auto;flex-direction:row;align-items:center;justify-content:flex-start}.toast>i{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:#17382a;color:var(--valenne-success)}.toast span{display:flex;flex-direction:column;flex:1}.toast small{color:var(--valenne-muted)}.toast button{background:transparent}.preview{min-height:480px;border-radius:var(--radius-xl);border:var(--border-subtle);overflow:hidden}.preview--media{position:relative;padding:70px;display:flex;align-items:flex-end;background:linear-gradient(90deg,#0d090a 4%,rgb(13 9 10/.85) 36%,transparent 70%),radial-gradient(circle at 75% 28%,#743043 0%,#27161e 30%,#0b090a 65%)}.preview--media:after{content:"";position:absolute;right:13%;top:16%;width:32%;aspect-ratio:1;border-radius:50% 50% 44% 56%;background:linear-gradient(140deg,#c86f7c,#391724 55%,#100a0c);filter:blur(1px);opacity:.75}.hero-copy{position:relative;z-index:1;max-width:460px}.hero-copy h3{font:400 clamp(42px,6vw,76px)/.95 var(--font-heading);letter-spacing:-.04em;margin:12px 0 22px}.hero-copy p{color:var(--valenne-text-secondary)}.media-row{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:22px}.media-card{position:relative;min-height:210px;padding:16px;border-radius:var(--radius-lg);border:var(--border-subtle);overflow:hidden;background:var(--bg,linear-gradient(140deg,#4b1f2b,#141012));display:flex;flex-direction:column;justify-content:flex-end;transition:.25s}.media-card:before{content:"";position:absolute;inset:0;background:linear-gradient(transparent 25%,rgb(0 0 0/.82))}.media-card>*{z-index:1}.media-card:hover{transform:translateY(-4px);border-color:#6b3c49}.media-card h3{margin:4px 0 0;font:400 20px var(--font-heading)}.media-card span{font-size:10px;color:var(--valenne-text-secondary)}.nav-demo{max-width:280px;margin-bottom:24px;padding:14px;border:var(--border-subtle);border-radius:var(--radius-xl);background:#0d0a0b}.lite-list{display:grid;gap:10px;max-width:860px}.lite-item{display:flex;align-items:center;gap:16px;padding:13px;border-radius:var(--radius-lg);background:var(--valenne-bg-1);border:var(--border-subtle)}.lite-thumb{width:96px;aspect-ratio:16/10;border-radius:var(--radius-sm);background:var(--bg)}.lite-item>span{display:flex;flex-direction:column;flex:1}.lite-item small{color:var(--valenne-muted)}.music-layout{display:grid;grid-template-columns:300px 1fr;gap:20px}.album-card,.player,.mini-player{border:var(--border-subtle);border-radius:var(--radius-xl);background:linear-gradient(145deg,#1a1115,#0b090a);box-shadow:var(--shadow-md)}.album-card{padding:20px}.album-art,.player__art{display:grid;place-items:center;aspect-ratio:1;border-radius:var(--radius-lg);margin-bottom:20px;background:radial-gradient(circle at 38% 30%,#db7788 0%,#762238 35%,#160b0f 72%)}.album-art span,.player__art span,.mini-art{font:italic 400 68px var(--font-brand);color:rgb(255 255 255/.82)}.album-card h3{font:400 25px var(--font-heading);margin:4px 0}.album-card>span{color:var(--valenne-muted)}.player{padding:32px;display:grid;grid-template-columns:180px 1fr;gap:22px;align-items:center}.player__art{grid-row:span 3;margin:0}.player h3{font:400 32px var(--font-heading);margin:3px 0}.player p,.player small{color:var(--valenne-muted)}.wave{height:45px;display:flex;align-items:center;gap:5px}.wave i{width:4px;height:var(--h,30%);border-radius:4px;background:var(--valenne-pink)}.wave i:nth-child(2),.wave i:nth-child(7){--h:70%}.wave i:nth-child(3),.wave i:nth-child(6){--h:95%}.wave i:nth-child(4){--h:55%}.wave i:nth-child(5){--h:82%}.player__controls{display:flex;align-items:center;gap:14px}.player__controls button,.mini-player button{background:transparent;color:var(--valenne-text-secondary);font-size:20px}.player__controls .play{width:50px;height:50px;border-radius:50%;background:var(--valenne-text);color:var(--valenne-bg-0)}.timeline{grid-column:2;display:flex;align-items:center;gap:9px;color:var(--valenne-muted);font-size:10px}.mini-player{margin-top:20px;padding:10px 14px;display:flex;align-items:center;gap:13px}.mini-art{width:48px;height:48px;display:grid;place-items:center;font-size:24px;border-radius:var(--radius-sm);background:linear-gradient(135deg,#9e2c47,#2b1119)}.mini-player>span{display:flex;flex-direction:column;min-width:180px}.mini-player small{color:var(--valenne-muted)}.form-card{max-width:520px;margin:auto;padding:36px;border:var(--border-subtle);border-radius:var(--radius-xl);background:var(--valenne-bg-1);box-shadow:var(--shadow-md);display:grid;gap:17px}.brand--vertical{justify-content:center;flex-direction:column}.brand--vertical img{width:56px;height:56px}.form-card h3{text-align:center;font:400 30px var(--font-heading);margin:5px 0 -12px}.form-card>p{text-align:center;color:var(--valenne-muted)}.profile{display:flex;align-items:center;gap:15px;padding:20px;border:var(--border-subtle);border-radius:var(--radius-xl);background:var(--valenne-bg-1)}.profile .avatar{width:56px;height:56px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(135deg,#b82946,#461827);font-weight:700}.profile h3,.profile p{margin:0}.profile p{color:var(--valenne-muted)}.profile .icon-button{margin-left:auto}.product-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:18px}.product-card{position:relative;min-height:180px;padding:22px;border:var(--border-subtle);border-radius:var(--radius-xl);background:linear-gradient(140deg,var(--tone),#100b0d 68%);display:flex;flex-direction:column;justify-content:flex-end;overflow:hidden}.product-card:after{content:"V";position:absolute;right:18px;top:-15px;font:italic 100px var(--font-brand);color:rgb(255 255 255/.035)}.product-card h3{font:400 22px var(--font-heading);margin:5px 0}.product-card p{margin:0;color:var(--valenne-muted);font-size:12px}.tv-stage{min-height:540px;border:6px solid #211a1d;border-radius:var(--radius-xl);background:#080607;box-shadow:var(--shadow-md);display:grid;grid-template-columns:210px 1fr;overflow:hidden}.tv-menu{padding:34px 14px;background:#100c0e}.tv-menu .brand{margin:0 10px 28px}.tv-content{padding:50px}.tv-content h3{font:400 40px var(--font-heading);margin:6px 0 28px}.tv-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.tv-card{position:relative;min-height:170px;padding:15px;border-radius:var(--radius-lg);background:var(--bg);display:flex;align-items:flex-end;transition:.2s}.tv-card:after{content:"";position:absolute;inset:0;border-radius:inherit;background:linear-gradient(transparent,rgb(0 0 0/.75))}.tv-card b{z-index:1}.tv-card.focused{transform:scale(1.055);box-shadow:0 0 0 4px var(--valenne-pink),0 12px 38px rgb(184 41 70/.32)}.state-legend{display:flex;gap:10px;flex-wrap:wrap;margin-top:35px}.state-legend span{padding:8px 12px;border:var(--border-subtle);border-radius:var(--radius-sm);color:var(--valenne-muted)}.state-legend .focused{box-shadow:0 0 0 2px var(--valenne-pink);color:#fff}.state-legend .pressed{background:#341923;transform:scale(.96)}.state-legend .selected{border-left:3px solid var(--valenne-pink);background:#25171c;color:#fff}.state-legend .disabled{opacity:.42}.mobile-only{display:none}dialog{width:min(500px,calc(100% - 32px));padding:32px;border:var(--border-subtle);border-radius:var(--radius-xl);background:#120e10;color:var(--valenne-text);box-shadow:var(--shadow-md)}dialog::backdrop{background:rgb(0 0 0/.7);backdrop-filter:blur(5px)}.dialog-close{position:absolute;right:14px;top:14px;width:34px;height:34px;border-radius:50%;background:var(--valenne-surface)}.status-list{display:flex;gap:7px;flex-wrap:wrap}.muted{color:var(--valenne-muted)}
[data-preview-state="focus"] .demo:first-of-type .button--primary,[data-preview-state="focus"] .media-card:first-child{box-shadow:var(--focus-ring)}[data-preview-state="pressed"] .demo:first-of-type .button--primary{transform:scale(.96);background:#8f1f36}[data-preview-state="disabled"] .demo button,[data-preview-state="disabled"] .demo input{opacity:.42;pointer-events:none}[data-preview-state="loading"] .media-card:first-child{color:transparent;background:linear-gradient(90deg,#151012,#21191c,#151012);background-size:250%;animation:shimmer 1.4s infinite}[data-preview-state="error"] .spec-card:first-of-type{border-color:rgb(238 107 117/.45)}[data-preview-state="success"] .spec-card:first-of-type{border-color:rgb(88 201 148/.4)}
@media(max-width:1050px){.logo-grid{grid-template-columns:repeat(3,1fr)}.component-grid,.feedback-grid{grid-template-columns:repeat(2,1fr)}.product-grid{grid-template-columns:repeat(2,1fr)}.music-layout{grid-template-columns:250px 1fr}.player{grid-template-columns:120px 1fr}.tv-stage{grid-template-columns:170px 1fr}.tv-content{padding:35px}.tv-card{min-height:130px}}
@media(max-width:780px){.sidebar{transform:translateX(-105%);transition:transform .25s}.sidebar.open{transform:none;box-shadow:20px 0 60px #000}.mobile-only{display:inline-grid}main{margin-left:0;padding-inline:18px}.topbar{min-height:76px}.topbar .eyebrow{display:none}.topbar h1{font-size:21px}.toolbar{gap:5px}.select-wrap select{max-width:112px}.notice{margin-top:8px}.section-heading{padding-top:36px}.section-heading h2{font-size:34px}.grid--2,.music-layout{grid-template-columns:1fr}.logo-grid{grid-template-columns:repeat(2,1fr)}.media-row{grid-template-columns:repeat(2,1fr)}.preview--media{min-height:430px;padding:35px}.component-grid,.feedback-grid{grid-template-columns:1fr 1fr}.player{grid-template-columns:100px 1fr;padding:20px}.product-grid{grid-template-columns:1fr 1fr}.tv-stage{grid-template-columns:1fr}.tv-menu{display:none}.tv-content{padding:25px}.tv-cards{grid-template-columns:repeat(3,1fr)}}
@media(max-width:480px){body{font-size:14px}.toolbar .icon-button{display:none}.topbar{gap:10px}.section-heading{display:block}.section-heading>.status{margin-top:15px}.logo-grid,.component-grid,.feedback-grid,.media-row,.product-grid{grid-template-columns:1fr}.swatches{grid-template-columns:repeat(2,1fr)}.spec-card{padding:18px}.preview--media{min-height:390px;padding:25px}.hero-copy h3{font-size:42px}.media-card{min-height:175px}.music-layout{grid-template-columns:1fr}.player{grid-template-columns:70px 1fr}.player h3{font-size:23px}.wave{display:none}.timeline{grid-column:1/-1}.mini-player>span{min-width:0}.mini-player>.progress{display:none}.form-card{padding:24px}.tv-cards{grid-template-columns:1fr}.tv-card{min-height:145px}.state-legend{display:grid;grid-template-columns:1fr 1fr}}
[data-device="mobile"] .page{max-width:390px}[data-device="mobile"] .logo-grid,[data-device="mobile"] .component-grid,[data-device="mobile"] .feedback-grid,[data-device="mobile"] .media-row,[data-device="mobile"] .product-grid{grid-template-columns:1fr}[data-device="tablet"] .page{max-width:800px}[data-device="tv"] .page{max-width:1280px}[data-device="tv"] body{font-size:17px}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important}}

/* Contenção responsiva validada para a matriz oficial. */
html,body{overflow-x:hidden}.page>*,.grid>*,.component-grid>*,.feedback-grid>*,.music-layout>*,.player>*,.product-grid>*,.topbar>*{min-width:0}.field input,.field select{min-width:0}
.nav-item{width:100%;border:0;background:transparent;text-align:left}.nav-item:disabled{opacity:.42;cursor:not-allowed}
@media(max-width:900px){.sidebar{transform:translateX(-105%);transition:transform .25s}.sidebar.open{transform:none;box-shadow:20px 0 60px #000}.mobile-only{display:inline-grid}main{margin-left:0;padding-inline:18px}.music-layout{grid-template-columns:250px 1fr}}
@media(max-width:600px){.toolbar .select-wrap:nth-child(2){display:none}.logo-tile .brand__words small{font-size:7px;letter-spacing:.22em;padding-left:.22em}.music-layout{grid-template-columns:1fr}.form-card{width:100%}.section-heading h2{overflow-wrap:anywhere}}
@media(max-width:350px){.select-wrap select{max-width:88px;padding-left:8px}.topbar h1{font-size:18px}.topbar{gap:6px}.topbar>.mobile-only{width:36px}.notice{font-size:12px}.mini-player button:last-child{display:none}}