/* Additional sections inherit the existing SeaArt design tokens. */
.expansion{min-width:0}.expansion p{font-size:16px;line-height:1.85}.expansion p:last-child{margin-bottom:0}.expansion a{color:var(--purple-dark);text-decoration:underline;text-underline-offset:4px}.expansion h2{max-width:850px}.expansion h3{font-size:19px}.expansion .evidence-note{font-size:12px;line-height:1.65;margin:14px 0 0;color:#8c7a98}.visual-block{min-width:0}.visual-block img{display:block;width:100%;object-fit:cover}.editorial-split{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center}.editorial-copy p{margin:0 0 18px}.editorial-copy h2{margin-bottom:22px}.reverse-split{grid-template-columns:.85fr 1.15fr}.narrow-copy{max-width:850px;margin-bottom:30px}.section-afterword{max-width:990px;margin:25px 0 0}.example-lab{padding:16px;border:1px solid #e5d9ed;border-radius:22px;background:#fff}.switch-bar{display:flex;flex-wrap:wrap;gap:7px;padding:5px;background:#f4eff8;border:1px solid #ebe1f1;border-radius:13px;margin-bottom:16px}.switch-bar button{flex:1;min-height:42px;padding:9px 12px;color:#7a6589;font-size:14px;line-height:1.35;border:1px solid transparent;border-radius:9px;transition:background .2s,color .2s,box-shadow .2s;cursor:pointer}.switch-bar button[aria-pressed=true]{background:white;border-color:#e2d1ed;color:#8147a7;box-shadow:0 2px 5px #5a3a7510}.switch-bar button:focus-visible{outline:2px solid var(--purple);outline-offset:2px}.art-window{border-radius:13px;overflow:hidden;aspect-ratio:1.25;background:#eee5f4}.art-window img{height:100%;object-position:50% 30%}.example-panel figcaption{font-size:14px;line-height:1.7;color:#80708c;margin:15px 4px 5px;min-height:76px}.example-panel figcaption strong{display:block;font-size:19px;color:#403247;margin-bottom:5px}.example-panel[hidden],.revision-panel[hidden]{display:none}.example-panel:not([hidden]),.revision-panel:not([hidden]){animation:example-swap .4s ease both}@keyframes example-swap{from{opacity:.55;filter:saturate(.65)}to{opacity:1;filter:saturate(1)}}.format-explainer{display:grid;grid-template-columns:1fr 1fr;gap:55px;align-items:center}.crop-demo{padding:20px;border-radius:20px;background:#f0e8f6;border:1px solid #e1d2eb}.crop-stage{height:330px;display:flex;align-items:center;justify-content:center;background:#e6dcec;border-radius:13px;overflow:hidden}.crop-window{position:relative;width:260px;height:260px;overflow:hidden;border:4px solid white;box-shadow:0 5px 20px #39204620;transition:width .5s ease,height .5s ease}.crop-window[data-ratio-view=portrait]{width:232px;height:290px}.crop-window[data-ratio-view=wide]{width:100%;height:210px}.crop-window img{height:100%;object-position:center 35%}.thirds-grid{position:absolute;inset:0;background:linear-gradient(90deg,transparent 33%,#ffffff80 33%,#ffffff80 33.4%,transparent 33.4%,transparent 66%,#ffffff80 66%,#ffffff80 66.4%,transparent 66.4%),linear-gradient(transparent 33%,#ffffff80 33%,#ffffff80 33.4%,transparent 33.4%,transparent 66%,#ffffff80 66%,#ffffff80 66.4%,transparent 66.4%);pointer-events:none}.crop-demo .visual-caption{font-size:13px;min-height:42px;line-height:1.6}.brief-board{display:grid;grid-template-columns:1.05fr 1fr;border:1px solid #e2d4ec;background:#fff;border-radius:22px;overflow:hidden}.brief-main{padding:38px;background:#f1e8f8;display:flex;flex-direction:column;justify-content:center}.board-label{color:#8c689f;font-size:13px;margin-bottom:25px}.brief-main h3{font-size:28px;letter-spacing:-.7px;line-height:1.25}.brief-tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px}.brief-tags span{padding:6px 10px;border:1px solid #d9c3e8;background:#f9f5fc;border-radius:8px;font-size:12px;color:#8a669f}.brief-notes{list-style:none;margin:0;padding:32px 36px;counter-reset:brief}.brief-notes li{counter-increment:brief;padding:19px 0 19px 40px;position:relative;border-bottom:1px solid var(--line)}.brief-notes li:last-child{border:0}.brief-notes li:before{content:'0' counter(brief);position:absolute;left:0;color:#b889d0;font-size:18px}.brief-notes strong{color:#493451;font-size:16px}.brief-notes p{font-size:14px;line-height:1.8;margin:9px 0 0}.decision-table{border:1px solid #e5dce9;border-radius:18px;overflow:hidden;background:white}.decision-row{display:grid;grid-template-columns:.72fr 1.15fr 1.13fr;border-bottom:1px solid #eee7f2}.decision-row:last-child{border:0}.decision-row>div{padding:22px 24px;font-size:14px;line-height:1.8;color:#82718f;min-width:0}.decision-row>div:first-child{color:#48324f;font-weight:500}.decision-row>div+div{border-left:1px solid #eee7f2}.table-head{background:#f1e9f8}.table-head>div{font-size:13px;line-height:1.5;color:#80618f;font-weight:500;padding-top:16px;padding-bottom:16px}.storyboard{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.frame-image{position:relative;border-radius:15px;overflow:hidden;aspect-ratio:1.5}.frame-image img{height:100%}.frame-image>span{position:absolute;bottom:11px;left:11px;background:#211825b3;color:white;font-size:12px;padding:3px 10px;border-radius:8px}.storyboard h3{margin-bottom:9px}.storyboard figcaption{margin:20px 0 0}.storyboard p{font-size:14px;line-height:1.8;margin:0}.camera-demo{padding:18px;background:white;border-radius:21px;border:1px solid #e3d6ed}.camera-stage{position:relative;border-radius:14px;overflow:hidden;aspect-ratio:1.3}.camera-stage img{height:100%;filter:brightness(.8)}.camera-frame{position:absolute;inset:15%;border:2px solid #fff;border-radius:6px;transform:scale(1);transition:transform 1.1s cubic-bezier(.2,.7,.2,1)}.camera-frame i:before,.camera-frame i:after{content:'';position:absolute;background:white;top:50%;left:50%}.camera-frame i:before{width:18px;height:1px;transform:translate(-50%,-50%)}.camera-frame i:after{width:1px;height:18px;transform:translate(-50%,-50%)}.camera-frame span{position:absolute;left:9px;bottom:8px;color:#fff;font-size:12px;background:#30233b90;border-radius:5px;padding:3px 6px}.camera-stage[data-camera-view=push] .camera-frame{transform:scale(.7)}.camera-stage[data-camera-view=pan] .camera-frame{transform:translateX(13%)}.camera-description{font-size:14px!important;min-height:55px;margin:16px 2px 0;line-height:1.7!important}.script-sheet{border:1px solid #dfcde9;border-radius:21px;overflow:hidden;background:white}.script-title{padding:25px 30px;background:#f0e6f7;display:flex;align-items:center;gap:24px}.script-title strong{flex:1;font-size:22px;color:#523362}.script-title span{font-size:13px;color:#9975ad}.script-sheet dl{margin:0;padding:6px 30px}.script-sheet dl>div{display:grid;grid-template-columns:120px 1fr;gap:30px;border-bottom:1px solid #eee5f3;padding:22px 0}.script-sheet dl>div:last-child{border:0}.script-sheet dt{font-size:14px;color:#a16bbf}.script-sheet dd{margin:0;font-size:16px;color:#675372;line-height:1.85}.editorial-columns{display:grid;grid-template-columns:1fr 1fr;gap:45px;margin-top:32px}.editorial-columns p{margin:0}.source-map{padding:14px;border:1px solid #e3d7eb;border-radius:20px;background:white}.source-map-image{position:relative;border-radius:13px;overflow:hidden;aspect-ratio:1.05}.source-map-image img{height:100%;object-position:30% center}.safe-frame{position:absolute;inset:10%;border:1px dashed white;box-shadow:0 0 0 100px #40224825;border-radius:6px}.frame-label{position:absolute;left:15px;right:15px;bottom:14px;padding:7px 10px;text-align:center;background:#241a30b5;color:white;border-radius:7px;font-size:12px}.source-notes{display:flex;flex-wrap:wrap;gap:12px 18px;padding:16px 0 3px;font-size:12px;color:#8a7398}.source-notes b{color:#ae70d1;margin-right:5px}.motion-plan{background:#fff;border:1px solid #e1d1ed;border-radius:22px;overflow:hidden}.motion-plan-head{padding:24px 30px;background:#f1e8f8;display:flex;align-items:center;justify-content:space-between;gap:20px}.motion-plan-head h3{margin:0}.motion-plan-head>span{font-size:12px;color:#9579a5}.motion-lanes{display:grid;grid-template-columns:1fr 1fr}.motion-lanes>div{padding:32px 35px;position:relative}.motion-lanes>div+div{border-left:1px solid #ece2f2}.lane-dot{display:block;width:13px;height:13px;border:2px solid #b697c6;border-radius:50%;margin-bottom:20px}.moving-dot{background:#bb88d8;border-color:#bb88d8}.motion-lanes p{margin-bottom:23px}.motion-wave{height:40px;display:flex;align-items:center;gap:12px}.motion-wave i{display:block;width:6px;height:18px;border-radius:8px;background:#d7bce8}.motion-wave i:nth-child(2n){height:30px}.motion-wave i:nth-child(3n){height:40px;background:#b487cd}.stability-lines{height:40px;display:grid;align-content:center;gap:8px;max-width:130px}.stability-lines i{height:3px;background:#d5c8de;border-radius:4px}.review-ribbon{display:grid;grid-template-columns:repeat(3,1fr);gap:0;border:1px solid #e1d3eb;border-radius:19px;overflow:hidden;background:#f4eef9}.review-ribbon>div{padding:25px 30px}.review-ribbon>div+div{border-left:1px solid #e1d3eb}.review-ribbon b{display:block;color:#8d55ad;font-size:18px;margin-bottom:9px}.review-ribbon span{color:#82708f;font-size:14px;line-height:1.8;display:block}.detail-split{display:grid;grid-template-columns:1fr 1fr;gap:55px;align-items:center}.detail-inspector{padding:18px;background:#fff;border:1px solid #e3d4ed;border-radius:21px}.detail-window{position:relative;aspect-ratio:1.3;overflow:hidden;border-radius:12px}.detail-window img{height:100%;transition:transform .7s ease;transform-origin:74% 50%}.detail-window[data-detail-view=close] img{transform:scale(2)}.detail-reticle{position:absolute;left:59%;top:20%;width:27%;height:55%;border:1px solid white;box-shadow:0 0 0 1px #77538650;transition:opacity .4s}.detail-window[data-detail-view=close] .detail-reticle{opacity:0}.resolution-layout{display:grid;grid-template-columns:1fr 1fr;gap:50px;align-items:center}.resolution-diagram{padding:25px;background:white;border:1px solid #e3d6ec;border-radius:20px}.resolution-four{position:relative;aspect-ratio:1.5;background:#f1e9f8;border:1px solid #d8b9ed;border-radius:8px;display:flex;justify-content:flex-end;text-align:right;padding:20px}.resolution-four span{font-size:13px;color:#9972b0;line-height:1.7}.resolution-four b{font-size:14px}.resolution-two{position:absolute;bottom:-1px;left:-1px;width:50%;height:50%;background:#dec9ed;border:1px solid #b88bd2;border-radius:0 7px 0 8px;text-align:right;padding:8px 13px}.resolution-two span{color:#8551a1;font-size:11px}.resolution-two b{font-size:11px}.resolution-one{position:absolute;bottom:-1px;left:-1px;width:50%;height:50%;background:#ae7cc9;border:1px solid #9959bd;border-radius:0 6px 0 8px;display:grid;place-content:center;padding:2px}.resolution-one span{color:white;text-align:center;font-size:10px;line-height:1.5}.resolution-one b{font-size:9px}.resolution-diagram>p{font-size:14px;text-align:center;color:#9b75af;margin-bottom:0}.file-path{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid #e3d6ec;background:#fff;border-radius:19px;overflow:hidden}.file-path>div{padding:26px}.file-path>div+div{border-left:1px solid #e9dff0}.file-path span{display:block;font-size:29px;color:#c49edb;letter-spacing:-1px;margin-bottom:21px}.file-path strong{display:block;font-size:17px;color:#57415f;margin-bottom:10px}.file-path small{font-size:13px;line-height:1.7;color:#9a87a5;display:block}.backdrop-demo{padding:17px;background:#fff;border:1px solid #e4d6ef;border-radius:22px}.backdrop-stage{display:grid;place-items:center;aspect-ratio:1.2;overflow:hidden;border-radius:13px;background:#fbfafc;transition:background .45s}.backdrop-stage[data-backdrop-view=dark]{background:#382b45}.backdrop-stage[data-backdrop-view=lavender]{background:#dbc8ec}.cup-art{width:100%;max-width:400px;height:auto;display:block}.backdrop-stage .cup-art{width:93%;transition:transform .55s}.backdrop-stage[data-backdrop-view=lavender] .cup-art{transform:translateY(-4px)}.mask-triptych{display:grid;grid-template-columns:repeat(3,1fr);gap:21px}.mask-scene{aspect-ratio:1.2;border-radius:15px;border:1px solid #e3d7eb;display:grid;place-items:center;overflow:hidden}.original-scene{background:linear-gradient(180deg,#e9dceb 63%,#d3bda8 63%)}.black-scene{background:#17131a}.checker-scene{background-color:#fff;background-image:conic-gradient(#ece6f0 25%,transparent 0 50%,#ece6f0 0 75%,transparent 0);background-size:24px 24px}.mask-triptych figcaption{margin-top:20px}.mask-triptych h3{font-size:18px}.mask-triptych p{font-size:14px;line-height:1.75}.catalog-layout{display:grid;grid-template-columns:.8fr 1.2fr;gap:50px;align-items:center}.catalog-demo{display:grid;grid-template-columns:1fr 1fr;gap:15px}.catalog-demo>div{aspect-ratio:.77;border:1px solid #e3d7eb;border-radius:15px;background:#f0e7f7;display:flex;flex-direction:column;align-items:center;justify-content:center;overflow:hidden;padding:14px}.catalog-demo>div:nth-child(2){background:white;justify-content:flex-end}.catalog-demo span{font-size:12px;color:#9577a5;padding-bottom:8px}.catalog-demo .cup-art{max-width:240px}.prompt-revision{border:1px solid #dfcdea;padding:20px;background:#fff;border-radius:21px;margin-top:30px}.revision-panel{padding:22px 19px 10px;min-height:235px}.revision-panel blockquote{font-size:25px;line-height:1.6;letter-spacing:-.5px;color:#6f4783;margin:0 0 20px;max-width:900px}.revision-panel p{max-width:930px;font-size:15px}.annotated-image{position:relative;aspect-ratio:.93;border-radius:20px;overflow:hidden}.annotated-image img{height:100%}.art-marker{position:absolute;width:33px;height:33px;display:grid;place-items:center;color:#7f4d9b;background:#fff;border:1px solid #d5b4e9;border-radius:50%;box-shadow:0 3px 14px #27133a30;font-size:15px}.marker-one{left:48%;top:45%}.marker-two{left:26%;top:31%}.marker-three{right:14%;bottom:23%}.annotated-notes{list-style:none;padding:0;margin:25px 0 0}.annotated-notes li{padding:16px 0;border-top:1px solid #e2d6eb}.annotated-notes b{font-size:17px;color:#755588;font-weight:500}.annotated-notes p{font-size:15px;margin:8px 0 0}.experiment-ledger{border:1px solid #dfcde9;border-radius:19px;overflow:hidden;background:white}.ledger-caption{display:flex;justify-content:space-between;padding:21px 25px;gap:20px;color:#9677a7;font-size:13px}.experiment-ledger .decision-table{border:0;border-top:1px solid #e5dce9;border-radius:0}.constraint-pair{display:grid;grid-template-columns:1fr 1fr;gap:24px}.constraint-pair article{background:#fff;border:1px solid #e7dcec;border-radius:18px;padding:30px}.constraint-pair article:last-child{background:#f1e7f8;border-color:#decaeb}.constraint-pair blockquote{font-size:19px;line-height:1.7;color:#896c99;margin:18px 0}.constraint-pair p{font-size:14px;line-height:1.8}.constraint-pair article:last-child blockquote{color:#73518b}
/* One-time, modest motion. Content remains readable before the observer runs. */
[data-reveal]{transition:opacity .7s ease,transform .7s cubic-bezier(.2,.7,.2,1)}.motion-ready [data-reveal].reveal-pending{opacity:.72}.motion-ready [data-reveal=editorial].reveal-pending .visual-block{clip-path:inset(0 3% 0 3% round 20px);transform:scale(.985)}.motion-ready [data-reveal=panel].reveal-pending{transform:translateY(8px)}[data-reveal=editorial] .visual-block{clip-path:inset(0 0 0 0 round 20px);transition:clip-path .85s ease,transform .85s ease}.motion-ready .is-revealed .motion-wave i{animation:wave-once .8s ease both;animation-delay:calc(var(--order,0)*70ms)}.motion-ready .is-revealed .file-path>div{animation:step-once .6s ease both;animation-delay:calc(var(--order,0)*90ms)}@keyframes wave-once{0%{transform:scaleY(.45)}60%{transform:scaleY(1.1)}100%{transform:scaleY(1)}}@keyframes step-once{from{opacity:.45;transform:translateX(6px)}to{opacity:1;transform:none}}
@media(max-width:1000px){.editorial-split,.format-explainer,.detail-split,.resolution-layout,.catalog-layout{gap:30px}.expansion p{font-size:15px}.brief-main{padding:28px}.brief-notes{padding:20px 25px}.script-title{padding:20px 24px}.decision-row>div{padding:18px}.file-path>div{padding:22px}.revision-panel blockquote{font-size:22px}.crop-stage{height:290px}.crop-window{width:230px;height:230px}.crop-window[data-ratio-view=portrait]{width:208px;height:260px}.crop-window[data-ratio-view=wide]{height:160px}.storyboard{gap:14px}.storyboard h3{font-size:17px}}
@media(max-width:800px){.editorial-split,.format-explainer,.detail-split,.resolution-layout,.catalog-layout{grid-template-columns:1fr;gap:28px}.editorial-split .visual-block,.format-explainer .visual-block,.detail-split .visual-block{width:100%;max-width:590px;justify-self:center}.reverse-split .editorial-copy{grid-row:1}.art-window{aspect-ratio:1.5}.source-map-image{aspect-ratio:1.5}.annotated-image{aspect-ratio:1.25}.brief-board{grid-template-columns:1fr}.brief-main{padding:30px}.brief-notes{padding:15px 30px}.motion-plan-head{align-items:flex-start;flex-direction:column;gap:8px}.motion-lanes>div{padding:26px}.storyboard p{font-size:13px}.storyboard h3{font-size:16px}.file-path{grid-template-columns:1fr 1fr}.file-path>div:nth-child(3){border-left:0;border-top:1px solid #e9dff0}.file-path>div:nth-child(4){border-top:1px solid #e9dff0}.resolution-diagram{max-width:500px;width:100%;margin:auto}.constraint-pair article{padding:24px}.constraint-pair blockquote{font-size:17px}.mask-triptych{gap:14px}.mask-triptych h3{font-size:16px}.catalog-demo{max-width:590px;margin:auto;width:100%}.crop-stage{height:330px}.crop-window{width:260px;height:260px}.crop-window[data-ratio-view=portrait]{width:232px;height:290px}.crop-window[data-ratio-view=wide]{height:225px}.editorial-columns{gap:28px}.review-ribbon>div{padding:22px}.review-ribbon b{font-size:16px}}
@media(max-width:560px){.expansion p{font-size:15px}.expansion h3{font-size:18px}.switch-bar button{padding:9px 7px;font-size:12px;min-height:44px}.example-lab,.camera-demo,.detail-inspector,.backdrop-demo{padding:12px;border-radius:17px}.art-window{aspect-ratio:1.15}.example-panel figcaption{font-size:14px;min-height:105px}.example-panel figcaption strong{font-size:18px}.editorial-columns,.constraint-pair{grid-template-columns:1fr;gap:24px}.brief-main{padding:25px}.brief-main h3{font-size:25px}.brief-notes{padding:10px 23px}.brief-notes li{padding-left:33px}.brief-tags span{font-size:12px}.decision-row{display:block;padding:18px 20px}.decision-row>div{padding:5px 0;font-size:14px}.decision-row>div+div{border:0}.decision-row>div:first-child{font-size:16px;margin-bottom:8px}.decision-row>div:not(:first-child):before{content:attr(data-label);display:block;font-size:12px;color:#ae83c4;margin:8px 0 4px}.decision-row.table-head{display:none}.storyboard,.mask-triptych{grid-template-columns:1fr;gap:25px}.storyboard figure{display:grid;grid-template-columns:1fr;gap:0}.storyboard figcaption{margin:14px 0 0}.storyboard h3{font-size:19px}.storyboard p{font-size:14px}.frame-image{aspect-ratio:1.6}.camera-stage{aspect-ratio:1.3}.camera-description{min-height:77px}.script-title{padding:18px;gap:12px;flex-wrap:wrap}.script-title strong{font-size:20px;flex-basis:60%}.script-title span{font-size:12px}.script-sheet dl{padding:0 20px}.script-sheet dl>div{grid-template-columns:1fr;gap:8px;padding:20px 0}.script-sheet dd{font-size:15px}.script-sheet dt{font-size:13px}.motion-lanes{grid-template-columns:1fr}.motion-lanes>div+div{border-left:0;border-top:1px solid #ece2f2}.motion-plan-head{padding:22px}.motion-lanes>div{padding:25px}.review-ribbon{grid-template-columns:1fr}.review-ribbon>div+div{border-left:0;border-top:1px solid #e1d3eb}.review-ribbon>div{padding:20px 25px}.file-path>div{padding:21px 17px}.file-path strong{font-size:15px}.file-path small{font-size:12px}.file-path span{margin-bottom:12px}.resolution-diagram{padding:16px}.resolution-four{padding:15px;aspect-ratio:1.25}.resolution-four span{font-size:11px}.resolution-four b{font-size:12px}.resolution-two{padding:6px}.resolution-two b{font-size:10px}.resolution-one b{font-size:8px}.resolution-one span{font-size:9px}.mask-scene{aspect-ratio:1.5}.mask-scene .cup-art{max-width:320px;width:86%}.mask-triptych figcaption{margin-top:14px}.mask-triptych h3{font-size:19px}.mask-triptych p{font-size:14px}.catalog-demo{gap:10px}.catalog-demo>div{padding:8px;aspect-ratio:.72}.catalog-demo span{font-size:11px;text-align:center}.prompt-revision{padding:12px}.revision-panel{padding:16px 8px;min-height:335px}.revision-panel blockquote{font-size:21px;line-height:1.6}.revision-panel p{font-size:14px}.ledger-caption{padding:20px;flex-direction:column;gap:6px}.constraint-pair article{padding:25px}.constraint-pair blockquote{font-size:18px}.crop-demo{padding:14px}.crop-stage{height:280px}.crop-window{width:210px;height:210px}.crop-window[data-ratio-view=portrait]{width:192px;height:240px}.crop-window[data-ratio-view=wide]{height:150px}.source-map-image{aspect-ratio:1.1}.source-notes{gap:10px;font-size:11px}.annotated-image{aspect-ratio:1.05}.art-marker{width:29px;height:29px;font-size:13px}}
@media(prefers-reduced-motion:reduce){.expansion *,[data-reveal],[data-reveal] .visual-block{animation:none!important;transition:none!important;scroll-behavior:auto!important}.motion-ready [data-reveal].reveal-pending{opacity:1;transform:none}.motion-ready [data-reveal=editorial].reveal-pending .visual-block{clip-path:none;transform:none}}
/* Keep the crop mathematically correct at every breakpoint. */
.crop-window[data-ratio-view=wide]{width:min(100%,480px);height:auto;aspect-ratio:16/9}.resolution-one span{font-size:12px}.resolution-one b{display:none}
/* Each diagram has its own visual language and purpose. */
.alpha-explainer{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center;background:#fff;border:1px solid #e3d6ec;border-radius:20px;padding:32px}.alpha-pixels{background:#f6f0fa;border-radius:15px;padding:25px}.alpha-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:5px;aspect-ratio:1.2}.alpha-grid span{background:linear-gradient(rgb(153 96 182 / var(--alpha)),rgb(153 96 182 / var(--alpha))),repeating-conic-gradient(#fff 0 25%,#e8e1ed 0 50%) 0/16px 16px;border:1px solid #cdbbda;border-radius:3px}.alpha-axis{display:block;text-align:center;color:#87619b;font-size:14px;line-height:1.6;margin-top:20px}.alpha-legend article{position:relative;padding:18px 0 18px 82px;border-bottom:1px solid #eee5f3}.alpha-legend article:last-child{border:0}.alpha-legend b{position:absolute;left:0;top:20px;color:#9f62c4;font-size:20px}.alpha-legend h3{font-size:18px;margin:0 0 8px}.alpha-legend p{font-size:14px;margin:0;line-height:1.7}.catalog-wireframe{border:1px solid #decde9;border-radius:19px;background:#fff;padding:24px}.catalog-ruler{text-align:center;border-bottom:1px solid #d2b8e3;padding:0 0 15px;color:#906ca5;font-size:14px}.catalog-safe-area{margin:24px 20px 15px;border:1px dashed #c6a0dc;padding:20px}.catalog-image-slot{min-height:185px;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;background:#f0e7f8;border-radius:12px;padding:20px;gap:12px}.catalog-image-slot>span,.catalog-copy-slot>span{color:#aa74c7;font-size:24px}.catalog-image-slot strong{font-size:18px}.catalog-image-slot small{font-size:13px;color:#9275a3}.catalog-baseline{border-top:2px solid #b87bd9;padding-top:9px;text-align:center;font-size:12px;color:#906ca5;margin-top:17px}.catalog-copy-slot{display:flex;align-items:center;gap:17px;padding-top:25px}.catalog-copy-slot strong{font-size:16px}.catalog-copy-slot p{font-size:13px;margin:7px 0 0}.catalog-wireframe>.visual-caption{text-align:center;margin:0;font-size:12px}.alpha-grid span{transition:background-color .4s}
@media(max-width:800px){.alpha-explainer{gap:25px;padding:25px}.alpha-legend article{padding-left:70px}.alpha-legend b{font-size:17px}.catalog-wireframe{max-width:590px;width:100%;margin:auto}}
@media(max-width:560px){.alpha-explainer{grid-template-columns:1fr;padding:18px;gap:15px}.alpha-pixels{padding:18px}.alpha-legend h3{font-size:17px}.alpha-legend article{padding-left:72px}.catalog-wireframe{padding:18px}.catalog-safe-area{margin:20px 3px 16px;padding:15px}.catalog-image-slot{min-height:180px;padding:14px}.catalog-copy-slot{gap:12px}.catalog-image-slot strong{font-size:16px}}
@media(prefers-reduced-motion:reduce){.alpha-grid span{transition:none}}
@media(max-width:560px){.alpha-legend article{padding:18px 0}.alpha-legend b{position:static;display:block;margin-bottom:10px}}