/* A creative companion to Lyverne's editorial homepage. */
.studio-page{overflow-x:clip}.studio-page h4{margin:0;font-size:10px;letter-spacing:.08em}.studio-page .eyebrow{font-size:10px;letter-spacing:.1em;line-height:1.5}.studio-nav{padding:24px 3.15vw;display:flex;justify-content:space-between;align-items:center;position:relative;z-index:30;gap:24px}.studio-nav .brand{width:190px;flex-shrink:0}.studio-nav .brand img{filter:none}.studio-nav nav{display:flex;align-items:center;gap:26px}.studio-nav nav>a{font-size:10px;letter-spacing:.07em;font-weight:600}.studio-nav nav>a:hover{text-decoration:underline}.studio-current{display:flex;align-items:center;gap:8px}.studio-current i{width:6px;height:6px;border-radius:50%;background:var(--orange)}.studio-nav .bag-toggle{font-size:10px}.studio-nav .menu-toggle{font-size:10px;gap:18px}.studio-page .sr-only{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0,0,0,0)}
.studio-hero{padding:62px 6.5vw 75px;display:grid;grid-template-columns:1.12fr 1fr;gap:6vw;align-items:center;min-height:680px}.studio-hero-copy{position:relative}.studio-hero h1{font-size:clamp(76px,8.5vw,158px);line-height:.94;letter-spacing:-.035em;margin:28px 0 36px;position:relative;z-index:2}.studio-hero .circled-word{white-space:nowrap}.studio-hero .draw-circle{stroke-width:2.2;inset:1% -6%;height:105%}.studio-intro{font-size:14px;line-height:1.65;letter-spacing:-.02em}.studio-hero .oval-link{margin-top:27px;font-size:13px}.studio-hero-note{position:absolute;left:49%;bottom:4px;width:170px;font-size:12px!important;transform:rotate(-7deg)}.studio-hero-note svg{width:100px;height:55px;margin:12px 0 0 18px;display:block}.studio-visual{position:relative;padding:8px 6px 0 0}.editorial-frame{margin:0;transform:rotate(4deg);background:var(--ink);padding:10px 10px 0;box-shadow:0 16px 35px #20201c10}.editorial-frame>img{width:100%;height:auto;aspect-ratio:3/4;object-fit:cover;display:block}.editorial-frame figcaption{color:var(--cream);font-size:7px;letter-spacing:.06em;display:flex;justify-content:space-between;gap:10px;padding:14px 4px}.studio-sticker{position:absolute;right:-43px;top:-35px;width:139px;height:139px;border-radius:50%;background:var(--orange);color:var(--ink);box-shadow:0 1px 0 #20201c;transform:rotate(10deg)}.studio-sticker>svg{position:absolute;inset:0;animation:seal-spin 30s linear infinite;fill:currentColor;font:600 12px Manrope;letter-spacing:.9px}.studio-sticker>span{position:absolute;inset:37px 0;text-align:center;font:700 36px/.95 Khand}.visual-swatch{position:absolute;left:-30px;bottom:42px;display:flex;align-items:center;gap:0;background:var(--cream);padding:9px;transform:rotate(-8deg);box-shadow:0 6px 10px #20201c15}.visual-swatch i{width:32px;height:39px;background:var(--ink)}.visual-swatch i:nth-child(2){background:#c4b8a3}.visual-swatch i:nth-child(3){background:var(--orange)}.visual-swatch span{font-size:8px;width:65px;line-height:1.5;padding-left:10px}
.daily-note{margin:24px 3.15vw 115px;background:var(--orange);border:1px solid var(--ink);border-radius:3px;display:grid;grid-template-columns:.75fr 2fr 1fr;align-items:center;gap:35px;padding:36px 40px;position:relative}.daily-label .tiny-star{font-size:35px;display:block;line-height:1;margin-bottom:18px}.daily-label time{font-size:10px;display:block;margin-top:8px}.daily-note blockquote{margin:0;padding:0 30px;border-left:1px solid #20201c40;border-right:1px solid #20201c40}.daily-note blockquote p{font:700 clamp(30px,3vw,51px)/1.08 Khand;letter-spacing:-.02em;max-width:550px}.daily-note cite{font-style:normal;font-size:8px;letter-spacing:.08em;display:block;margin-top:18px}.daily-action>p{font-size:12px;line-height:1.55;margin:10px 0 14px}.daily-action button{font-size:10px;letter-spacing:.03em;background:none;padding:0 0 4px;border-bottom:1px solid currentColor;display:flex;gap:35px}.daily-action button[aria-pressed=true]{font-weight:700}
.studio-assistant{padding:0 3.15vw 155px;scroll-margin-top:20px}.studio-section-head{display:flex;align-items:flex-end;justify-content:space-between;gap:40px;margin-bottom:42px}.studio-section-head h2{font-size:clamp(54px,5.4vw,96px);line-height:1;letter-spacing:-.025em;margin-top:20px}.studio-section-head>p{font-size:13px;line-height:1.7;margin-bottom:8px;max-width:310px}.assistant-layout{display:grid;grid-template-columns:.88fr 1.12fr;gap:23px;align-items:start}.style-form{border:1px solid var(--ink);border-radius:18px;padding:30px;background:#ebe5d9;position:sticky;top:25px}.assistant-label{display:flex;align-items:center;gap:13px;padding-bottom:25px;border-bottom:1px solid var(--line)}.assistant-label>img{width:36px;height:36px;filter:url(#logo-ink)}.assistant-label strong{font-size:10px;letter-spacing:.04em;display:block}.assistant-label span{font-size:10px;display:block;margin-top:5px}.assistant-label .companion-dot{width:7px;height:7px;background:var(--orange);border-radius:50%;margin:0 0 0 auto;flex-shrink:0}.style-form h3{font-size:34px;letter-spacing:-.03em;line-height:1.1;margin-top:29px}.form-help{font-size:11px;margin-top:9px;color:#5c5a52}.style-fields{display:grid;grid-template-columns:1fr 1fr;gap:20px 13px;margin:29px 0}.style-fields label,.prompt-label{font-size:9px;font-weight:600;letter-spacing:.04em;display:block}.style-fields select{width:100%;font:400 12px Manrope;color:var(--ink);background:var(--cream);border:1px solid #b3ad9f;border-radius:3px;padding:13px 8px;margin-top:8px;cursor:pointer;min-height:44px}.studio-page select:focus-visible,.studio-page textarea:focus-visible{outline:2px solid var(--orange);outline-offset:3px}.prompt-label{display:flex;align-items:center;justify-content:space-between;gap:10px}.prompt-label span{font-size:8px;color:#67635b;font-weight:400}.style-form textarea{width:100%;font:400 12px/1.6 Manrope;resize:vertical;min-height:96px;max-height:280px;border:1px solid #b3ad9f;border-radius:4px;background:var(--cream);color:var(--ink);padding:13px;margin-top:9px}.prompt-hint{font-size:9px;line-height:1.6;color:#67635b;margin-top:8px}.prompt-chips{display:flex;gap:7px;flex-wrap:wrap;margin:17px 0 24px}.prompt-chips button{background:none;border:1px solid #bcb5a7;border-radius:30px;font-size:9px;padding:9px 12px;transition:background .2s}.prompt-chips button:hover{background:var(--cream)}.build-look{display:flex;align-items:center;justify-content:space-between;width:100%;background:var(--ink);color:var(--cream);padding:18px 20px;border-radius:3px;font-size:11px;letter-spacing:.04em;transition:background .2s}.build-look:hover{background:#414039}.build-look span{font-size:21px;line-height:1}.form-footnote{text-align:center;font-size:9px;margin-top:13px;color:#67635b}
.look-result{border:1px solid var(--ink);border-radius:18px;padding:28px 30px;background:var(--cream);min-width:0;scroll-margin-top:25px}.look-result:focus{outline:none}.look-result:focus-visible{outline:2px solid var(--orange);outline-offset:5px}.look-topline{display:flex;align-items:center;justify-content:space-between;gap:12px;border-bottom:1px solid var(--line);padding-bottom:18px}.look-topline>span:last-child{font-size:8px;letter-spacing:.025em;text-align:right}.guide-message{font-size:11px;line-height:1.6;max-width:90%;margin-top:17px;color:#67635b}.look-visual-row{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:10px;margin:7px 0 24px}.look-tee{position:relative}.look-tee img{width:100%;height:auto;display:block;transform:rotate(-8deg);filter:drop-shadow(0 10px 7px #20201c10);animation:studio-float 7s ease-in-out infinite}.look-tee>span{font-size:6px;letter-spacing:.07em;display:block;text-align:center;margin-top:3px}.look-identity h3{font-size:clamp(34px,3.3vw,63px);line-height:1.02;letter-spacing:-.02em;overflow-wrap:normal}.look-palette{display:flex;gap:5px;margin-top:20px}.look-palette span{height:25px;width:35px;border:1px solid #20201c25;border-radius:2px}.look-items{margin:0}.look-items>div{display:grid;grid-template-columns:92px 1fr;padding:11px 0;border-top:1px solid var(--line);font-size:11px;line-height:1.5;gap:15px}.look-items dt{color:#67635b}.look-items dd{margin:0}.look-reason{background:#e6dfd1;padding:18px;border-radius:4px;margin-top:17px}.look-reason p{font-size:11px;line-height:1.7;margin-top:8px}.look-advice details{padding:15px 0;border-bottom:1px solid var(--line)}.look-advice summary{font-size:11px;display:flex;justify-content:space-between;cursor:pointer;list-style:none}.look-advice summary::-webkit-details-marker{display:none}.look-advice details p{font-size:11px;line-height:1.7;margin:10px 0}.look-advice details[open] summary span{transform:rotate(45deg)}#look-extra{font-size:11px;line-height:1.6;margin-top:15px;border-left:2px solid var(--orange);padding-left:12px}.look-actions{display:flex;gap:20px;justify-content:space-between;align-items:center;margin-top:20px}.look-actions .oval-link{font-size:11px}.piece-link{font-size:10px;background:none;padding:8px 0;border-bottom:1px solid currentColor}.followup-chips{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin-top:22px}.followup-chips>span{font-size:8px;letter-spacing:.04em}.followup-chips button{border:1px solid var(--line);border-radius:30px;background:transparent;padding:8px 11px;font-size:9px}.followup-chips button:hover{background:var(--orange);border-color:var(--orange)}.result-enter{animation:result-in .45s var(--ease)}@keyframes result-in{from{opacity:.4;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@keyframes studio-float{0%,100%{transform:translateY(0) rotate(-8deg)}50%{transform:translateY(-7px) rotate(-5deg)}}
.color-playground{background:var(--ink);color:var(--cream);position:relative;padding:75px 3.15vw 80px}.color-playground .studio-section-head{position:relative;margin-bottom:25px}.color-playground .spinning-sun{position:absolute;right:31%;top:10px;width:95px;height:95px}.color-playground .studio-section-head>p{max-width:270px}.color-lab{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:7vw}.color-stage{position:relative;min-width:0;aspect-ratio:1.15;display:grid;place-items:center}.color-disc{position:absolute;inset:10% 17%;border:1px solid #f3eee438;border-radius:50%;background:#36362e;transition:background .5s}.color-stage>img{display:block;position:relative;width:100%;height:auto;transform:rotate(-9deg);filter:drop-shadow(0 28px 15px #0003);animation:studio-float 9s ease-in-out infinite}.color-stage-caption{position:absolute;bottom:0;font-size:8px;letter-spacing:.09em}.color-controls{padding:20px 35px 20px 0}.color-buttons{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:35px}.color-buttons button{background:none;color:var(--cream);padding:8px 2px;font-size:9px;display:flex;align-items:center;flex-direction:column;gap:13px}.color-buttons i{width:34px;height:34px;border:1px solid #f3eee450;border-radius:50%;background:var(--swatch);position:relative}.color-buttons [aria-pressed=true] i:after{content:'';position:absolute;inset:-5px;border:1px solid var(--cream);border-radius:50%}.color-controls h3{font-size:clamp(37px,4vw,70px);line-height:1.06;letter-spacing:-.02em;margin-bottom:18px}.color-controls>p{font-size:13px;line-height:1.7;max-width:365px;color:#dbd5ca}.palette-bars{display:flex;margin:28px 0 35px;border-radius:3px;overflow:hidden;min-height:72px}.palette-bars>span{flex:1;display:flex;flex-direction:column;justify-content:flex-end;padding:12px 9px;font-size:8px;gap:4px;line-height:1.3;border:1px solid #f3eee421}.palette-bars small{font-size:7px;opacity:.7}.color-controls .oval-link{font-size:13px;color:var(--cream)}.color-tip{font-size:8px;letter-spacing:.1em;display:block;margin-top:30px;color:#c2bbac}
.style-school{padding:110px 3.15vw 80px}.style-school .studio-section-head h2{font-size:clamp(49px,5vw,85px)}.lesson-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;align-items:start}.lesson{border:1px solid var(--ink);background:#e7e0d3;border-radius:3px;overflow:hidden}.lesson:nth-child(2){background:var(--orange)}.lesson:nth-child(3){background:var(--ink);color:var(--cream)}.lesson summary{display:block;list-style:none;cursor:pointer;padding:24px}.lesson summary::-webkit-details-marker{display:none}.lesson-index{font-size:9px;letter-spacing:.07em;display:flex;justify-content:space-between;align-items:center}.lesson-index>span{font-size:22px;font-weight:400;line-height:1;transition:transform .3s}.lesson[open] .lesson-index>span{transform:rotate(45deg)}.lesson h3{font-size:clamp(37px,3.8vw,65px);line-height:1;letter-spacing:-.025em;margin-top:24px}.lesson-hint{font-size:8px;letter-spacing:.04em;display:block;margin-top:20px}.lesson>p{padding:0 24px;font-size:12px;line-height:1.8}.lesson>button{font-size:10px;margin:20px 24px 28px;padding:0 0 7px;border-bottom:1px solid currentColor;color:inherit;background:none;text-align:left}.proportion-art,.contrast-art,.detail-art{height:180px;position:relative;display:flex;align-items:center;justify-content:center;margin-top:24px;overflow:hidden}.proportion-art>img{position:absolute;width:140px;top:-10px;left:calc(50% - 70px);z-index:2;transform:rotate(-5deg)}.trouser-art{position:absolute;width:85px;height:105px;top:84px;left:calc(50% - 43px);background:#8b8678;clip-path:polygon(6% 0,93% 0,100% 98%,57% 100%,49% 36%,44% 100%,0 98%);transform:rotate(-5deg)}.contrast-art i{width:90px;height:145px;background:var(--ink);border:1px solid #20201c40;transform:rotate(-13deg);box-shadow:1px 7px 10px #20201c10}.contrast-art i:nth-child(2){background:var(--cream);transform:rotate(7deg);margin-left:-20px}.contrast-art i:nth-child(3){background:#797a5a;transform:rotate(18deg);margin-left:-20px}.detail-art>img{width:100%;height:100%;object-fit:cover;object-position:50% 50%;transition:transform .6s}.lesson summary:hover .detail-art>img{transform:scale(1.08)}.lesson summary:hover .contrast-art i:first-child{transform:rotate(-20deg)}.contrast-art i{transition:transform .4s}
.saved-notes{padding:45px 3.15vw 120px}.saved-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:25px;margin-bottom:35px}.saved-heading h2{font-size:clamp(58px,5.3vw,92px);line-height:1;margin-top:17px}.saved-heading>p{font-size:12px;line-height:1.7;margin-left:auto}.saved-counter{font-size:11px;white-space:nowrap}.saved-counter>span{font:700 44px/1 Khand;color:var(--orange)}.saved-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}.notebook-empty{grid-column:1/-1;border:1px dashed #a9a294;display:flex;justify-content:center;align-items:center;gap:35px;padding:45px 25px}.notebook-empty .empty-sketch{font:700 80px/1 Khand;color:var(--orange);transform:rotate(-15deg)}.notebook-empty h3{font-size:32px;line-height:1.2}.notebook-empty p{font-size:11px;margin:10px 0 20px;line-height:1.5}.notebook-empty a{font-size:10px;text-decoration:underline;text-underline-offset:5px}.saved-card{border:1px solid var(--line);padding:15px;background:#e7e0d3;position:relative}.saved-card>img{width:100%;height:auto;aspect-ratio:1.25;object-fit:contain;display:block}.saved-card>h3{font-size:25px;line-height:1.06;margin:10px 0}.saved-card>p{font-size:9px;line-height:1.5}.saved-card-actions{display:flex;justify-content:space-between;gap:10px;margin-top:20px}.saved-card-actions button{font-size:9px;background:none;padding:6px 0;text-decoration:underline;text-underline-offset:4px}.saved-card-actions .remove-note{color:#6c655a}#notebook-status{font-size:11px;line-height:1.5;min-height:18px;margin-top:12px}.studio-bottom-note{display:flex;justify-content:space-between;align-items:center;gap:20px;border-top:1px solid var(--line);padding-top:30px;margin-top:45px;font-size:9px;letter-spacing:.06em}.studio-bottom-note .motion-toggle{font-size:9px;background:none}.studio-page.motion-paused .studio-sticker>svg,.studio-page.motion-paused .look-tee img,.studio-page.motion-paused .color-stage>img,.studio-page.motion-paused .spinning-sun,.studio-page.motion-paused .draw-arrow path,.studio-page.motion-paused .draw-circle path{animation-play-state:paused}.studio-page .oval-link.drawn-cta{border:0;border-radius:0;background:none;transform:rotate(-3deg);padding:13px 21px 15px;isolation:isolate;white-space:nowrap}.studio-page .oval-link.drawn-cta:hover{background:none;color:inherit;transform:rotate(0)}.studio-page .drawn-cta:is(:hover,:focus-visible) .cta-sketch path{animation:cta-redraw .8s var(--ease) both}.studio-page .lyverne-footer .back-top{display:none}.studio-page .menu-dialog nav{margin:8vh 0}.studio-page .menu-dialog nav a{font-size:clamp(40px,6vw,90px)}
@media(min-width:1600px){.studio-hero{padding-top:80px;padding-bottom:100px}.studio-intro{font-size:17px}.style-form,.look-result{padding:40px}.style-form h3{font-size:43px}.style-fields select{font-size:14px;padding:16px 12px}.style-fields label,.prompt-label{font-size:10px}.style-form textarea{font-size:14px}.look-items>div,.look-reason p,.look-advice summary,.look-advice details p,.guide-message{font-size:13px}.look-items>div{padding:14px 0;grid-template-columns:120px 1fr}.proportion-art,.contrast-art,.detail-art{height:250px}}
@media(max-width:1000px){.studio-nav nav{gap:17px}.studio-home-link{display:none}.studio-hero{gap:5vw;padding:40px 5vw 70px;min-height:0}.studio-hero h1{font-size:8.5vw}.studio-hero-note{display:none}.studio-sticker{width:110px;height:110px;right:-15px;top:-25px}.studio-sticker>span{inset:28px 0;font-size:29px}.daily-note{padding:28px;gap:25px;grid-template-columns:.6fr 1.5fr 1fr;margin-bottom:90px}.daily-note blockquote{padding:0 22px}.daily-note blockquote p{font-size:32px}.studio-section-head>p{font-size:12px}.assistant-layout{gap:16px;grid-template-columns:1fr 1fr}.style-form,.look-result{padding:22px}.style-fields{gap:17px 10px}.style-form h3{font-size:28px}.look-visual-row{grid-template-columns:1fr}.look-tee{max-width:220px;margin:auto}.look-identity{display:flex;gap:15px;align-items:center;justify-content:space-between}.look-identity h3{font-size:37px}.look-palette{margin-top:0}.look-palette span{width:20px}.look-topline>span:last-child{max-width:90px}.look-items>div{grid-template-columns:75px 1fr;gap:9px}.look-actions{gap:10px}.look-actions .oval-link{font-size:10px}.color-playground .spinning-sun{display:none}.color-lab{gap:3vw}.color-controls{padding-right:5px}.color-buttons{gap:8px}.color-buttons button{font-size:8px}.color-controls h3{font-size:38px}.color-controls>p{font-size:12px}.lesson summary{padding:20px}.lesson-grid{gap:15px}.lesson h3{font-size:37px}.proportion-art,.contrast-art,.detail-art{height:155px}.contrast-art i{height:125px;width:65px}.saved-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:700px){.studio-nav{padding:18px 5vw;gap:12px}.studio-nav .brand{width:148px}.studio-nav nav{gap:9px}.studio-nav .studio-shop-link,.studio-nav .studio-current{display:none}.studio-nav .menu-toggle{gap:11px;padding:0 10px}.studio-nav .bag-toggle{padding:8px}.studio-hero{grid-template-columns:1fr;padding:33px 6vw 42px;gap:55px}.studio-hero h1{font-size:19vw;line-height:.94;margin:23px 0 28px}.studio-hero .eyebrow{font-size:9px}.studio-intro{font-size:13px}.studio-hero .oval-link{margin-top:22px;font-size:12px}.studio-hero-note{display:block;left:auto;right:-7px;bottom:7px;font-size:10px!important;width:130px}.studio-hero-note svg{width:70px;height:40px;margin-top:8px}.studio-visual{max-width:410px;width:90%;margin:0 auto 15px}.studio-sticker{right:-20px;top:-22px;width:105px;height:105px}.editorial-frame{padding:7px 7px 0;transform:rotate(3deg)}.editorial-frame figcaption{font-size:6px;padding:12px 2px;gap:8px}.visual-swatch{left:-20px;bottom:40px;padding:7px}.visual-swatch i{width:26px;height:32px}.visual-swatch span{font-size:7px}.daily-note{margin:22px 5vw 70px;grid-template-columns:1fr;gap:23px;padding:26px}.daily-label{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:12px}.daily-label .tiny-star{font-size:28px;margin:0}.daily-label .eyebrow{font-size:8px}.daily-label time{font-size:8px;margin:0}.daily-note blockquote{padding:22px 0;border:0;border-top:1px solid #20201c40;border-bottom:1px solid #20201c40}.daily-note blockquote p{font-size:37px;line-height:1.06}.daily-note cite{font-size:7px;margin-top:16px}.daily-action{display:grid;grid-template-columns:1fr auto;column-gap:20px}.daily-action>.eyebrow{grid-column:1/-1;font-size:8px}.daily-action>p{font-size:11px;max-width:230px;margin-bottom:0}.daily-action button{font-size:8px;align-self:end;gap:10px;white-space:nowrap}.studio-assistant{padding:0 5vw 95px}.studio-section-head{display:block;margin-bottom:29px}.studio-section-head h2{font-size:14vw;margin-top:15px}.studio-section-head>p{font-size:12px;margin-top:22px;max-width:none}.assistant-layout{grid-template-columns:1fr;gap:22px}.style-form{position:relative;top:auto;padding:25px 22px;border-radius:15px}.style-form h3{font-size:32px}.assistant-label strong{font-size:9px}.assistant-label span{font-size:9px}.style-fields{gap:21px 12px}.style-fields select{font-size:11px;padding:14px 7px;min-height:46px}.style-fields label,.prompt-label{font-size:8px}.style-form textarea{font-size:12px}.prompt-chips{gap:6px}.prompt-chips button{font-size:8px;padding:9px 10px}.look-result{padding:23px 20px;border-radius:15px}.look-visual-row{grid-template-columns:1fr 1fr;margin:15px 0 25px}.look-identity{display:block}.look-identity h3{font-size:10vw}.look-palette{margin-top:17px}.look-palette span{width:27px;height:23px}.look-tee>span{font-size:5px}.guide-message{font-size:10px;max-width:100%}.look-items>div{font-size:11px;grid-template-columns:78px 1fr}.look-actions .oval-link{font-size:11px}.look-actions{margin-top:24px}.followup-chips{gap:6px}.followup-chips button{font-size:8px;padding:9px}.color-playground{padding:40px 5vw 60px}.color-lab{grid-template-columns:1fr;gap:20px}.color-playground .studio-section-head>p{max-width:none}.color-stage{max-width:450px;width:100%;margin:auto;aspect-ratio:1.15}.color-controls{padding:15px 5px 0}.color-buttons{margin-bottom:30px;gap:12px}.color-buttons button{font-size:9px}.color-controls h3{font-size:12vw;margin-bottom:15px}.palette-bars{margin:22px 0 28px}.color-controls .oval-link{font-size:12px}.color-tip{font-size:7px}.style-school{padding:70px 5vw 50px}.style-school .studio-section-head h2{font-size:12vw}.lesson-grid{grid-template-columns:1fr;gap:20px}.lesson summary{padding:24px}.lesson h3{font-size:13vw}.lesson-index{font-size:9px}.proportion-art,.contrast-art,.detail-art{height:185px}.detail-art>img{object-position:50% 42%}.contrast-art i{height:160px;width:90px}.proportion-art>img{width:165px;left:calc(50% - 82px);top:-17px}.trouser-art{top:90px;width:100px;left:calc(50% - 50px)}.saved-notes{padding:30px 5vw 70px}.saved-heading{display:grid;grid-template-columns:1fr auto;gap:20px}.saved-heading h2{font-size:15vw}.saved-heading>p{grid-row:2;grid-column:1/-1;margin:0;font-size:11px}.saved-counter{align-self:end;margin-bottom:5px}.saved-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.notebook-empty{padding:30px 20px;gap:20px}.notebook-empty h3{font-size:29px}.notebook-empty p{font-size:10px}.notebook-empty .empty-sketch{font-size:65px}.saved-card{padding:12px}.saved-card>h3{font-size:24px}.saved-card>p{font-size:8px}.saved-card-actions{flex-wrap:wrap;margin-top:13px}.saved-card-actions button{font-size:9px}.studio-bottom-note{gap:18px;flex-wrap:wrap;font-size:8px;margin-top:30px;padding-top:25px}.studio-bottom-note .motion-toggle{font-size:8px;margin-left:auto}.studio-bottom-note>a{display:none}.studio-page .menu-dialog nav{margin:12vh 0}.studio-page .menu-dialog nav a{font-size:13vw}.studio-page .lyverne-footer .footer-top nav{width:100%}}
@media(max-width:370px){.studio-nav .brand{width:125px}.studio-nav .menu-toggle{gap:7px;font-size:9px}.studio-nav nav{gap:7px}.studio-hero-note{display:none}.daily-note{padding:22px}.daily-note blockquote p{font-size:32px}.daily-label{gap:8px}.style-form,.look-result{padding:20px 16px}.style-fields{gap:18px 9px}.style-fields select{font-size:10px}.prompt-label span{font-size:7px}.look-identity h3{font-size:10vw}.look-palette span{width:22px}.look-actions{gap:10px}.look-actions .oval-link{font-size:10px}.color-buttons button{font-size:8px}.notebook-empty{padding:25px 15px;gap:15px}.notebook-empty h3{font-size:25px}.studio-bottom-note{font-size:7px}.studio-bottom-note .motion-toggle{font-size:7px}}
@media(prefers-reduced-motion:reduce){.studio-sticker>svg,.look-tee img,.color-stage>img{animation:none!important}}

.studio-page main{overflow-x:clip}.studio-page .toast{white-space:normal;min-width:240px;text-align:center;line-height:1.5}
.studio-film{padding:0 3.15vw 65px}.studio-film .film-player{max-height:640px}.studio-film video{object-position:50% 42%}
@media(max-width:700px){.studio-film{padding:10px 5vw 45px}}
.studio-page .product-gallery>img.detail-crop{transform:scale(1.8);transform-origin:65% 30%}.studio-page .product-gallery{overflow:hidden}
/* Keep the interactive content readable at everyday browser sizes. */
.studio-page .studio-intro,.studio-page .studio-section-head>p,.daily-action>p,.look-reason p,.look-advice details p,.lesson>p,.color-controls>p,.saved-heading>p{font-size:16px}
.style-fields select,.style-form textarea,.build-look,.look-items>div,.look-advice summary,.guide-message,.look-actions .oval-link,.piece-link,.prompt-chips button,.followup-chips button,.color-buttons button,.lesson>button,.saved-card-actions button{font-size:14px}
.style-fields label,.prompt-label,.assistant-label strong,.assistant-label span,.form-help,.prompt-hint,.form-footnote,.look-topline>span:last-child,.daily-note cite,.daily-label time,.daily-action button,.color-tip,.lesson-index,.lesson-hint,.saved-card>p,.notebook-empty p{font-size:12px}
.look-identity h3{font-size:clamp(34px,3.3vw,63px)}.look-items>div{grid-template-columns:95px 1fr}.palette-bars>span{font-size:12px}.palette-bars small{font-size:11px}.assistant-label span{line-height:1.45}.prompt-label{gap:12px;line-height:1.5}.prompt-label span{font-size:10px}.studio-hero-note{left:auto;right:0}.studio-page .toast{max-width:min(92vw,420px)}
@media(max-width:1000px){.studio-hero-note{display:none}.look-items>div{grid-template-columns:80px 1fr}.look-actions{flex-wrap:wrap}}
@media(max-width:700px){.style-fields{grid-template-columns:1fr}.style-fields select{font-size:16px;padding:13px 10px}.style-form textarea{font-size:16px}.look-items>div{font-size:14px}.look-identity h3{font-size:10vw}.studio-page .studio-intro,.studio-page .studio-section-head>p{font-size:15px}.look-topline>span:last-child{font-size:10px;max-width:125px}.color-buttons button{font-size:11px}.daily-label{grid-template-columns:auto 1fr}.daily-label time{grid-column:2;margin-top:-8px}.daily-action{display:block}.daily-action button{margin-top:17px}.look-actions .oval-link{font-size:13px}.followup-chips button{font-size:12px}.notebook-empty{align-items:flex-start}.saved-card-actions button{font-size:12px}.saved-heading>p{font-size:14px}.prompt-chips button{font-size:12px}.look-tee>span{font-size:6px}.saved-card>p{font-size:11px}.palette-bars>span{font-size:10px}.palette-bars small{font-size:10px}}

/* ---------------------------------------------------------- the stylist
   Free-text styling advice. The colours carry the answer, so swatches sit
   beside every piece rather than the colour being named in prose alone. */
.stylist{margin-top:0}
.stylist-head h3{font-size:clamp(28px,3vw,38px);line-height:1;margin-bottom:8px}
.stylist-head .form-help{max-width:52ch}
#stylist-form{margin-top:18px}
#stylist-form textarea{width:100%;padding:14px 16px;border:1px solid var(--line);background:var(--cream);
  color:var(--ink);font:400 15px/1.55 Manrope,Arial,sans-serif;border-radius:3px;resize:vertical}
#stylist-form textarea:focus-visible{outline:2px solid var(--orange);outline-offset:2px;border-color:var(--orange)}
.stylist-actions{display:flex;align-items:center;gap:16px;margin-top:12px;flex-wrap:wrap}
.stylist-status{font-size:13px;color:var(--muted)}
#stylist-form .error{color:#a33b12;font-size:13px;margin-top:8px;min-height:18px}

.stylist-examples{display:flex;flex-wrap:wrap;align-items:center;gap:9px;margin-top:16px;font-size:13px;color:var(--muted)}
.stylist-examples button{border:1px solid var(--line);background:none;color:var(--ink);
  padding:7px 12px;border-radius:999px;font-size:13px;cursor:pointer}
.stylist-examples button:hover{background:var(--orange);border-color:var(--orange)}

.stylist-result{margin-top:26px;padding:24px;border:1px solid var(--ink);background:var(--cream);
  box-shadow:6px 6px 0 var(--orange)}
.stylist-headline{font:700 clamp(26px,3.2vw,38px)/1.05 Khand,sans-serif;text-transform:uppercase;margin:0 0 14px}
.stylist-palette{display:flex;gap:0;margin-bottom:20px;border:1px solid var(--ink);overflow:hidden;border-radius:3px}
.stylist-palette i{flex:1;height:34px}
.stylist-outfit{list-style:none;margin:0;padding:0;display:grid;gap:2px}
.stylist-outfit li{display:grid;grid-template-columns:18px 78px 1fr auto;align-items:baseline;gap:12px;
  padding:11px 0;border-bottom:1px solid var(--line)}
.stylist-outfit li:last-child{border-bottom:0}
.stylist-dot{width:14px;height:14px;border-radius:50%;border:1px solid #20201c33;align-self:center}
.stylist-dot.is-empty{background:repeating-linear-gradient(45deg,#fff,#fff 3px,var(--line) 3px,var(--line) 6px)}
.stylist-part{font-size:11px;font-weight:600;letter-spacing:.07em;text-transform:uppercase;color:var(--muted)}
.stylist-item{font-size:15px;line-height:1.4}
.stylist-colour{font-size:12px;color:var(--muted);white-space:nowrap}
.stylist-why{font-size:14px;line-height:1.6;margin-top:18px}
.stylist-tip{font-size:13px;line-height:1.55;margin-top:10px;color:var(--muted)}
.stylist-tip strong{color:var(--ink);letter-spacing:.06em;font-size:11px;text-transform:uppercase;margin-right:6px}
.stylist-declined{font-size:15px;line-height:1.6;margin:0}

@media(max-width:650px){
  .stylist-result{padding:18px;box-shadow:4px 4px 0 var(--orange)}
  /* Four columns do not fit a phone: stack the label above the garment and let
     the colour sit under it. */
  .stylist-outfit li{grid-template-columns:16px 1fr;gap:10px}
  .stylist-part{grid-column:2;margin-bottom:-6px}
  .stylist-item{grid-column:2}
  .stylist-colour{grid-column:2;white-space:normal}
  .stylist-palette i{height:28px}
}

/* The stylist is its own section now, not a column inside the guided picker's
   two-column grid, where it had displaced the result panel. */
.studio-stylist{padding:0 5vw calc(10vw + 70px)}
.studio-stylist .stylist{margin-top:0;padding-top:0;border-top:0;max-width:820px}
