html:has(.codex-colors){scroll-behavior:smooth;scroll-padding-top:36px;font-size:16px}body.codex-colors{--guide-line:var(--socratic-neutral-hairline);--guide-muted:var(--socratic-reading-muted);font-family:var(--aw-font-sans);letter-spacing:0;color:var(--socratic-ink);background:var(--socratic-ground);margin:0;font-size:16px;line-height:1.6}.codex-colors *{box-sizing:border-box}.codex-colors button,.codex-colors select,.codex-colors input{font:inherit}.codex-colors button,.codex-colors select{cursor:pointer}.codex-colors button:disabled{cursor:wait}.codex-colors p{margin:0 0 16px}.codex-colors h1,.codex-colors h2,.codex-colors h3,.codex-colors h4{margin:0;line-height:1.12}.codex-colors h3{font:650 21px/1.25 var(--aw-font-sans)}.codex-colors h4{font:700 22px/1.2 var(--aw-font-sans)}.codex-colors b,.codex-colors strong{font-weight:650}body.codex-colors h1{margin:18px 0 28px;font-size:clamp(58px,6vw,92px)}body.codex-colors h2{margin:12px 0 25px;font-size:clamp(36px,3.1vw,50px)}.codex-colors a{color:var(--socratic-ink);text-decoration:none}body.socratic-light.codex-colors main :is(p,li,dd) a:not([role=button]),body.socratic-light.codex-colors #sources a{text-underline-offset:5px;color:var(--socratic-ink)!important;text-decoration:underline!important;text-decoration-color:var(--socratic-pink)!important}body.socratic-light.codex-colors main :is(p,li,dd) a:not([role=button]):hover,body.socratic-light.codex-colors #sources a:hover{color:var(--socratic-ink)!important;text-decoration-color:currentColor!important}.codex-colors :is(button,select,a,input,summary):focus-visible{outline:2px solid var(--socratic-ink);outline-offset:4px}.codex-colors .skip{background:var(--socratic-panel);z-index:20;padding:12px;position:absolute;top:-100px;left:16px}.codex-colors .skip:focus{top:8px}.codex-colors .masthead{border-bottom:2px solid var(--socratic-pink);justify-content:space-between;align-items:center;gap:20px;margin:0 44px;padding:26px 0;display:flex}.codex-colors .masthead>a:first-child{font:500 32px/1 var(--aw-font-heading);letter-spacing:-.04em}.codex-colors .masthead span{gap:22px;font-size:15px;display:flex}.codex-colors .masthead b{color:var(--guide-muted);font-weight:400}.codex-colors .masthead>a:last-child{text-underline-offset:4px;font-size:14px;text-decoration:underline}.codex-colors .guide-layout{grid-template-columns:175px minmax(0,1280px);align-items:start;gap:70px;max-width:1630px;margin:auto;padding:0 44px;display:grid}.codex-colors .rail{padding-top:64px;position:sticky;top:36px}.codex-colors .rail nav{flex-direction:column;gap:12px;margin:22px 0 36px;display:flex}.codex-colors .rail nav a{border-left:2px solid #0000;margin-left:-14px;padding-left:12px;font-size:15px}.codex-colors .rail nav a:hover,.codex-colors .rail nav a[aria-current]{border-color:var(--socratic-pink);font-weight:650}.codex-colors .rail p,.codex-colors .rail-end{color:var(--guide-muted);font-size:13px}.codex-colors .hero{padding:66px 0 40px}.codex-colors .intro{letter-spacing:-.015em;max-width:850px;font-size:clamp(22px,2vw,28px);line-height:1.5}.codex-colors .hero-strip{border:1px solid var(--guide-line);height:28px;margin:36px 0 18px;display:flex}.codex-colors .hero-strip i{background:var(--chip);flex:1}.codex-colors .hero-strip i:first-child{flex:5}.codex-colors .hero-strip i:nth-child(2){flex:2}.codex-colors .hero-strip i:last-child{flex:.35}.codex-colors .small-label{font:500 12px/1.3 var(--aw-font-sans);text-transform:uppercase;letter-spacing:.09em;color:var(--guide-muted)}.codex-colors .caption{color:var(--guide-muted);max-width:900px;font-size:14px;line-height:1.55}.codex-colors .hero .caption{max-width:760px}.codex-colors section{border-top:1px solid var(--guide-line);padding:44px 0 56px;scroll-margin-top:28px}.codex-colors .section-head{justify-content:space-between;align-items:end;gap:25px;margin-bottom:20px;display:flex}.codex-colors .section-head h2{margin-bottom:0}.codex-colors .section-head>a{text-underline-offset:5px;font-size:14px;text-decoration:underline}.codex-colors .section-intro{max-width:720px;margin-bottom:30px;font-size:19px;line-height:1.6}.codex-colors .palette-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;margin-top:30px;display:grid}.codex-colors .pigment{border:1px solid var(--guide-line);background:var(--socratic-panel)}.codex-colors .pigment-swatch{background:var(--chip);align-items:end;height:144px;padding:20px;display:flex}.codex-colors .pigment-swatch span{font:450 46px/1 var(--aw-font-heading)}.codex-colors .pigment-info{padding:22px}.codex-colors .pigment h3{margin:8px 0 5px}.codex-colors .alias{color:var(--guide-muted);min-height:38px;font-size:12px;line-height:1.4}.codex-colors .pigment p{margin-top:18px;font-size:14px;line-height:1.6}.codex-colors code{overflow-wrap:anywhere;font:12px/1.6 ui-monospace,SFMono-Regular,Consolas,monospace}.codex-colors .pigment code,.codex-colors .support-item code{color:var(--guide-muted);display:block}.codex-colors .copy-value{border:0;border-bottom:1px solid var(--socratic-pink);text-align:left;background:0 0;justify-content:space-between;gap:15px;width:100%;margin:8px 0;padding:8px 0;font:500 15px/1.3 ui-monospace,SFMono-Regular,monospace;display:flex}.codex-colors .copy-value:hover{border-bottom-color:var(--socratic-ink)}.codex-colors details>summary{cursor:pointer}.codex-colors .pigment details{font-size:13px}.codex-colors .pigment details p{color:var(--guide-muted);margin-top:10px}.codex-colors .supporting{margin-top:34px}.codex-colors .supporting>summary{font:600 20px/1.4 var(--aw-font-sans);border-top:2px solid var(--socratic-pink);padding:15px 0}.codex-colors .support-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:28px;margin:20px 0;display:grid}.codex-colors .support-item{border-top:1px solid var(--guide-line);grid-template-columns:38px 1fr;gap:14px;padding-top:20px;display:grid}.codex-colors .small-swatch{border:1px solid var(--guide-line);width:38px;height:80px}.codex-colors .support-item h3{margin-top:5px;font-size:18px}.codex-colors .support-item p{margin-top:12px;font-size:14px}.codex-colors .support-item .copy-value{font-size:12px}.codex-colors .state-pair{border-top:1px solid var(--guide-line);grid-template-columns:1fr 1fr 1fr;gap:28px;padding:30px 0;display:grid}.codex-colors .state-pair h3{font-size:19px}.codex-colors .state-pair .caption{margin-top:8px}.codex-colors .state-sample .small-label{margin-bottom:18px;display:block}body.codex-colors .title-demo{font:700 26.4px/1.15 var(--aw-font-sans);letter-spacing:-.015em;transition:color .12s ease-out;color:var(--socratic-reading-headline)!important;text-decoration:none!important}body.codex-colors .title-demo:hover,body.codex-colors .force-title-hover,body.codex-colors .hold-hover .title-demo{color:var(--socratic-pink)!important}body.codex-colors #main .prose-demo a{color:var(--site-link)!important;text-decoration:none!important;transition:color .12s ease-out!important}body.codex-colors #main .prose-demo a:hover,body.codex-colors #main .prose-demo a.force-prose-hover,body.codex-colors #main .hold-hover .prose-demo a{color:var(--socratic-hover-blue)!important}.codex-colors .try-row{justify-content:space-between;gap:25px;padding:22px 0;font-size:14px;display:flex}.codex-colors .try-row label{align-items:center;gap:10px;display:flex}.codex-colors input{accent-color:var(--socratic-ink)}.codex-colors .try-row a{text-underline-offset:5px;text-decoration:underline}.codex-colors .note-box,.codex-colors .notice{border-left:3px solid var(--socratic-pink);background:var(--socratic-panel);margin:24px 0;padding:18px 22px}.codex-colors .note-box p,.codex-colors .notice p{max-width:900px;margin:8px 0 0;font-size:15px}.codex-colors .specimen{border:1px solid var(--guide-line);background:var(--socratic-panel);margin-bottom:16px;padding:36px}.codex-colors .specimen-date{border-bottom:2px solid var(--socratic-pink);margin-bottom:30px;padding-bottom:20px}.codex-colors .specimen-date>div{font:420 38px/1.2 var(--aw-font-heading);letter-spacing:-.045em;margin-top:7px}.codex-colors .specimen-columns{grid-template-columns:1.1fr 1fr;gap:60px;display:grid}.codex-colors .source-line{font-size:12px;font-weight:600}.codex-colors .source-line time{color:var(--socratic-reading-muted);margin-left:8px;font-weight:400}.codex-colors .topics{margin:22px 0;font:13px/1.5 ui-monospace,monospace}.codex-colors .sample-summary{letter-spacing:normal;color:color-mix(in srgb, var(--socratic-ink) 78%, var(--socratic-panel));font-size:16px;line-height:1.55}.codex-colors .sample-details{font-size:15px}.codex-colors .sample-details summary{color:var(--socratic-red)}.codex-colors .sample-details p{margin-top:14px}.codex-colors .byline{color:var(--socratic-reading-muted);margin-top:20px;font-size:13px}.codex-colors .specimen-aside{border-left:1px solid var(--guide-line);padding-left:35px}.codex-colors .specimen-aside>h3{margin-bottom:18px;font-size:17px}.codex-colors .button-stack{flex-direction:column;align-items:start;gap:18px;margin:26px 0;display:flex}.codex-colors .button-stack button{max-width:100%;font-size:16px}.codex-colors .focus-example{flex-direction:column;align-items:start;gap:14px;margin-top:28px;display:flex}.codex-colors .focus-only{border:1px solid var(--guide-line);background:var(--socratic-panel);outline:3px solid var(--socratic-focus-ring);outline-offset:4px;color:var(--socratic-ink);padding:12px 16px;font-size:15px}.codex-colors .analysis-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:28px;display:grid}.codex-colors .analysis-grid p{margin-top:15px;font-size:16px}.codex-colors .relationship{border:1px solid var(--guide-line);height:110px;margin-bottom:25px;display:flex}.codex-colors .relationship i{background:var(--left);flex:1}.codex-colors .relationship i:last-child{background:var(--right)}.codex-colors .subheading{margin:34px 0 16px}.codex-colors .range-label{align-items:center;gap:22px;margin:28px 0;font-size:14px;display:flex}.codex-colors .range-label input{flex:1}.codex-colors .range-label output{font-variant-numeric:tabular-nums;min-width:85px}.codex-colors .proportion-grid{grid-template-columns:1fr 1fr;gap:24px;margin-bottom:22px;display:grid}.codex-colors .mini-page{border:1px solid var(--guide-line);background:var(--socratic-panel);padding:22px}.codex-colors .area-band{background:linear-gradient(90deg, var(--socratic-pink) 65%, var(--socratic-navy) 65%);height:22px;margin:20px 0}.codex-colors .adjustable .area-band{height:var(--area-height,22px)}.codex-colors .mini-page h4{color:var(--socratic-navy)}.codex-colors .mini-page p{margin:16px 0 0;font-size:13px}.codex-colors .ink-lines{background:repeating-linear-gradient(to bottom, var(--socratic-ink) 0 1px, transparent 1px 11px);max-width:85%;height:44px;margin-top:20px}.codex-colors .table-wrap{border-top:1px solid var(--guide-line);margin:24px 0;overflow:auto}.codex-colors table{border-collapse:collapse;text-align:left;width:100%;font-size:14px}.codex-colors caption{text-align:left;color:var(--guide-muted);padding:14px 0;font-size:13px}.codex-colors th,.codex-colors td{border-bottom:1px solid var(--guide-line);vertical-align:middle;padding:14px 12px}.codex-colors th:first-child,.codex-colors td:first-child{padding-left:0}.codex-colors th{font-weight:600}.codex-colors thead th{color:var(--guide-muted);font-size:12px}.codex-colors .ratio{white-space:nowrap;font-variant-numeric:tabular-nums;font-weight:650}.codex-colors td small{color:var(--guide-muted);font-size:12px;display:block}.codex-colors .contrast-sample{border:1px solid var(--guide-line);justify-content:center;align-items:center;padding:8px 12px;font-size:23px;font-weight:600;display:inline-flex}.codex-colors .verdict{font-size:13px}.codex-colors .method{font-size:15px}.codex-colors .method p{margin-top:18px}.codex-colors .explorer-controls{align-items:end;gap:20px;display:flex}.codex-colors .explorer-controls label{flex-direction:column;flex:1;gap:8px;font-size:14px;display:flex}.codex-colors select{border:1px solid var(--guide-line);background:var(--socratic-panel);min-width:0;color:var(--socratic-ink);border-radius:4px;width:100%;padding:10px 30px 10px 12px}.codex-colors :is(#swap,.export-actions button){border:1px solid var(--guide-line);background:var(--socratic-panel);color:var(--socratic-ink);border-radius:4px;padding:10px 16px}.codex-colors :is(#swap,.export-actions button):hover{border-color:var(--socratic-ink)}.codex-colors .explorer-sample{border:1px solid var(--guide-line);background:var(--socratic-ground);color:var(--socratic-navy);align-items:center;gap:35px;margin:22px 0;padding:30px;display:flex}.codex-colors .big-aa{font:420 80px/1 var(--aw-font-heading)}.codex-colors .explorer-sample strong{font-size:25px}.codex-colors .explorer-sample p{margin:5px 0 0}.codex-colors .explorer-result{font-size:14px}.codex-colors .select-label{align-items:center;gap:20px;margin:25px 0;display:flex}.codex-colors .select-label select{max-width:390px}.codex-colors .vision-preview{background:var(--socratic-ground);border:1px solid var(--guide-line);margin-bottom:20px;padding:30px}.codex-colors .vision-chips{grid-template-columns:repeat(3,1fr);gap:20px;display:grid}.codex-colors .vision-chips i{height:70px;display:block}.codex-colors .vision-chips span{font-size:13px}.codex-colors .vision-content{border-top:2px solid var(--socratic-pink);margin-top:30px;padding-top:25px}.codex-colors .vision-content .prose-demo{margin:25px 0}.codex-colors .vision-content .caption{margin:25px 0 0}.codex-colors .vision-filters{pointer-events:none;position:absolute}.codex-colors .usage-grid{grid-template-columns:1fr 1fr;gap:32px;display:grid}.codex-colors .usage-grid article{border-top:1px solid var(--guide-line);padding-top:22px}.codex-colors .usage-demo{min-height:130px;padding:24px 0}.codex-colors .usage-demo p{margin:15px 0 0}.codex-colors .usage-grid h3{margin-bottom:12px;font-size:20px}.codex-colors .usage-grid p{font-size:15px}.codex-colors .misuse{color:var(--socratic-navy)}.codex-colors .misuse strong{font-size:26.4px}.codex-colors .marked{font-size:22px}.codex-colors .straight-rule{background:var(--socratic-pink);height:3px;margin-top:20px}.codex-colors .wrong-wash{background:var(--socratic-pink-blush);color:var(--socratic-pink);padding:15px;font-size:19px;display:inline-block}.codex-colors .export-actions{flex-wrap:wrap;gap:15px;margin:25px 0;display:flex}.codex-colors .token-copy{text-align:left;border:none;border-bottom:1px solid var(--socratic-pink);overflow-wrap:anywhere;background:0 0;padding:0;font:12px/1.5 ui-monospace,monospace}.codex-colors .history>div{border-top:1px solid var(--guide-line);grid-template-columns:190px 1fr;gap:30px;padding:24px 0;display:grid}.codex-colors .history dt{color:var(--guide-muted);font-size:14px}.codex-colors .history p{margin:8px 0 0;font-size:15px}.codex-colors footer{border-top:2px solid var(--socratic-pink);padding:45px 0 70px}.codex-colors footer ul{flex-wrap:wrap;gap:12px 30px;margin:25px 0 40px;padding:0;font-size:14px;list-style:none;display:flex}.codex-colors footer code{color:var(--guide-muted)}.codex-colors #copy-status{background:var(--socratic-panel);border:1px solid var(--socratic-ink);max-width:calc(100vw - 40px);box-shadow:0 4px 25px var(--socratic-pink-glow);z-index:30;pointer-events:none;padding:12px 20px;font-size:14px;position:fixed;bottom:25px;right:25px}.codex-colors #copy-status:empty{display:none}@media (width>=2200px){.codex-colors .guide-layout{grid-template-columns:220px minmax(0,1450px);gap:100px;max-width:1870px}.codex-colors .masthead{max-width:2000px;margin:auto}.codex-colors .hero{padding-top:82px}.codex-colors .pigment-swatch{height:190px}}@media (width<=1150px){.codex-colors .guide-layout{grid-template-columns:140px minmax(0,1fr);gap:30px;padding:0 28px}.codex-colors .masthead{margin:0 28px}.codex-colors .palette-grid,.codex-colors .support-grid{grid-template-columns:repeat(2,1fr)}.codex-colors .analysis-grid{gap:18px}.codex-colors .specimen-columns{gap:28px}.codex-colors .specimen-aside{padding-left:20px}}@media (width<=760px){.codex-colors .masthead{align-items:start;margin:0 22px;padding:22px 0}.codex-colors .masthead>a:first-child{font-size:27px}.codex-colors .masthead span{text-align:right;flex-direction:column;gap:3px;font-size:12px}.codex-colors .masthead>a:last-child{display:none}.codex-colors .guide-layout{padding:0 22px;display:block}.codex-colors .rail{padding:20px 0 0;position:static}.codex-colors .rail>.small-label,.codex-colors .rail p,.codex-colors .rail-end{display:none}.codex-colors .rail nav{flex-flow:wrap;gap:10px 16px;margin:0}.codex-colors .rail nav a{border:0;margin:0;padding:0;font-size:12px}.codex-colors .hero{padding-top:40px}.codex-colors .hero h1{font-size:57px}.codex-colors .intro{font-size:22px}.codex-colors .intro br{display:none}.codex-colors section{padding:34px 0 40px}.codex-colors .section-head{display:block}.codex-colors .section-head .caption,.codex-colors .section-head>a{margin-top:15px;display:block}.codex-colors .palette-grid,.codex-colors .support-grid,.codex-colors .analysis-grid,.codex-colors .specimen-columns,.codex-colors .usage-grid{grid-template-columns:1fr}.codex-colors .pigment-swatch{height:155px}.codex-colors .alias{min-height:0}.codex-colors .state-pair{grid-template-columns:1fr 1fr;gap:20px}.codex-colors .state-pair>div:first-child{grid-column:1/-1}.codex-colors .state-pair .title-demo{font-size:22px}.codex-colors .try-row{flex-direction:column}.codex-colors .specimen{padding:23px}.codex-colors .specimen-aside{border-left:0;border-top:1px solid var(--guide-line);padding:25px 0 0}.codex-colors .proportion-grid{grid-template-columns:1fr}.codex-colors .range-label{gap:12px}.codex-colors .range-label input{min-width:60px}.codex-colors .explorer-controls{flex-wrap:wrap;gap:12px}.codex-colors .explorer-controls label{flex:100%}.codex-colors #swap{order:3}.codex-colors .explorer-sample{gap:22px;padding:22px}.codex-colors .big-aa{font-size:55px}.codex-colors .explorer-sample strong{font-size:20px}.codex-colors .select-label{display:block}.codex-colors .select-label select{margin-top:10px}.codex-colors .vision-preview{padding:20px}.codex-colors .vision-chips{gap:12px}.codex-colors .vision-chips span{margin-top:8px;font-size:11px;line-height:1.4;display:block}.codex-colors .history>div{grid-template-columns:1fr;gap:10px}.codex-colors .table-wrap table{min-width:620px}.codex-colors footer ul{display:block}.codex-colors footer li{margin:12px 0}.codex-colors .notice{padding:15px}}@media (prefers-reduced-motion:reduce){html:has(.codex-colors){scroll-behavior:auto}.codex-colors *{transition:none!important;animation:none!important}}@media print{html:has(.codex-colors){font-size:12px}.codex-colors{print-color-adjust:exact}.codex-colors .rail,.codex-colors .export-actions,.codex-colors .try-row,.codex-colors #copy-status,.codex-colors .skip{display:none}.codex-colors .guide-layout{max-width:none;padding:0 16px;display:block}.codex-colors .masthead{margin:0 16px}.codex-colors .hero{padding-top:25px}.codex-colors section{padding:26px 0}.codex-colors .palette-grid{grid-template-columns:repeat(3,1fr)}.codex-colors .pigment{break-inside:avoid}.codex-colors .pigment-swatch{height:80px}.codex-colors .pigment-info{padding:12px}.codex-colors .table-wrap{overflow:visible}.codex-colors .table-wrap table{min-width:0}.codex-colors #vision-preview{filter:none!important}.codex-colors :is(input,select),.codex-colors .explorer-controls{display:none}.codex-colors footer{padding-bottom:0}}.codex-colors p{color:inherit}.codex-colors p.caption,.codex-colors p.small-label,.codex-colors .byline{color:var(--guide-muted)}.codex-colors .sample-summary{color:color-mix(in srgb, var(--socratic-ink) 78%, var(--socratic-panel))}.codex-colors .prose-demo{color:var(--socratic-ink)}.codex-colors .state-control{border:0;flex-wrap:wrap;gap:8px 14px;margin:22px 0;padding:0;font-size:13px;display:flex}.codex-colors .state-control legend{margin-bottom:8px;padding:0;font-weight:650}.codex-colors .state-control label{cursor:pointer;align-items:center;gap:5px;display:flex}.codex-colors .drift-summary{border-left:3px solid var(--socratic-pink);justify-content:space-between;align-items:center;gap:16px;margin:18px 0;padding:12px 18px;display:flex}.codex-colors .drift-summary p{overflow-wrap:anywhere;margin:0;font-size:14px}.codex-colors #recheck-colors{border:1px solid var(--guide-line);background:var(--socratic-panel);flex-shrink:0;padding:7px 10px;font-size:13px}.codex-colors .has-drift{border-color:var(--socratic-red)}.codex-colors .drift-warning{color:var(--socratic-red);border-left:3px solid;padding-left:10px;font-size:13px}.codex-colors .color-record,.codex-colors .support-info{min-width:0}.codex-colors .color-record code{overflow-wrap:anywhere}.codex-colors .role-label,.codex-colors .recorded-value{color:var(--guide-muted);margin:6px 0;font-size:12px}.codex-colors .record-details{margin-top:15px;font-size:13px}.codex-colors .record-details h4{font:650 13px/1.4 var(--aw-font-sans);margin:18px 0 8px}.codex-colors .record-details ul{margin-bottom:12px;padding-left:18px;list-style:outside}.codex-colors .record-details li{margin-bottom:7px}.codex-colors .record-source{overflow-wrap:anywhere;margin-top:12px;font-size:12px;display:block}.codex-colors .token-example{border-top:1px solid var(--guide-line);margin-top:20px;padding-top:15px;font-size:14px}.codex-colors .token-example:empty{display:none}.codex-colors .token-example .title-demo{font-size:22px}.codex-colors .token-example button{max-width:100%;font-size:14px}.codex-colors .attribution-demo{text-decoration:underline;text-decoration-color:var(--socratic-pink-soft);text-underline-offset:4px;text-decoration-thickness:3px}.codex-colors .composite-swatch{border:1px solid var(--guide-line);height:80px;display:flex}.codex-colors .composite-swatch i{flex:1}.codex-colors .rulings-disclosure{margin:24px 0}.codex-colors .rulings-disclosure>summary{border-top:2px solid var(--socratic-pink);padding:14px 0;font-weight:600}.codex-colors .ruling{border-top:1px solid var(--guide-line);grid-template-columns:120px minmax(0,1fr);gap:28px;padding:26px 0;display:grid}.codex-colors .ruling>time{color:var(--guide-muted);font-size:13px}.codex-colors .ruling h3{margin-bottom:14px}.codex-colors .ruling p{font-size:15px}.codex-colors .ruling blockquote{border-left:3px solid var(--socratic-pink);margin:20px 0;padding-left:20px}.codex-colors .ruling blockquote p{white-space:pre-line}.codex-colors .ruling cite{color:var(--guide-muted);font-size:12px;font-style:normal}.codex-colors .export-actions a{border:1px solid var(--guide-line);border-radius:4px;padding:10px 16px;font-size:15px}body.codex-colors[data-example-state=hover] [data-state-sample] .title-demo{color:var(--socratic-pink)!important}body.codex-colors[data-example-state=hover] #main [data-state-sample] .prose-demo a{color:var(--socratic-hover-blue)!important}body.codex-colors[data-example-state=hover] [data-state-sample] .btn-secondary{border-color:var(--socratic-pink)!important}body.codex-colors[data-example-state=hover] [data-state-sample] .btn-primary{box-shadow:0 .65rem 1.45rem var(--socratic-pink-glow);transform:translateY(-1px)}body.codex-colors[data-example-state=hover] [data-state-sample] .btn-form-submit{box-shadow:0 .65rem 1.5rem var(--socratic-pink-glow);transform:translateY(-1px);background:var(--socratic-pink-soft)!important}body.codex-colors[data-example-state=hover] [data-state-sample] :is(.btn-primary,.btn-secondary):after{transform:translate(3px)}body.codex-colors[data-example-state=focus] [data-state-sample] :is(a,button,summary){outline-offset:4px;outline:3px solid var(--socratic-focus-ring)!important}.codex-colors .focus-only{outline:none}@media (width<=760px){.codex-colors .state-control{margin-bottom:0}.codex-colors .drift-summary{flex-direction:column;align-items:start}.codex-colors .ruling{grid-template-columns:1fr;gap:12px}}@media print{.codex-colors .state-control,.codex-colors #recheck-colors{display:none}.codex-colors .support-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.codex-colors .ruling{break-inside:avoid}}@layer utilities{body.codex-colors[data-example-state=hover] [data-state-sample] .btn-secondary,body.codex-colors[data-example-state=focus] [data-state-sample] .btn-secondary{border-color:var(--socratic-pink)!important}body.codex-colors[data-example-state=hover] [data-state-sample] .btn-form-submit{background:var(--socratic-pink-soft)!important}}