.examples-dialog{width:min(1240px,calc(100vw - 36px));max-width:1240px;max-height:94dvh;background:#0a1727}.examples-dialog .dialog-body{padding:28px 32px 32px}.examples-intro{position:relative;padding:8px 0 30px;border-bottom:1px solid #c3d9e72b;margin-bottom:28px}.examples-intro .eyebrow{color:#83a6bf;letter-spacing:.15em}.examples-intro h3{font-size:clamp(25px,2.7vw,36px);font-weight:500;color:#e1eff8;margin:16px 0 12px}.examples-intro p{color:#9ebbd1;font-size:15px;line-height:1.9;max-width:850px;margin:0 0 12px}.examples-intro small{font-size:12px;color:#6f8ea9;line-height:1.8;display:block}.example-design-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;align-items:start}.example-design{--accent:#bdb4f0;position:relative;border:1px solid color-mix(in srgb,var(--accent) 27%,transparent);border-top:2px solid var(--accent);background:linear-gradient(155deg,color-mix(in srgb,var(--accent) 9%,#0c1b2c),#0c1b2c 65%);padding:23px 23px 20px;min-width:0;overflow:hidden}.example-memory{--accent:#8bc9e6}.example-elation{--accent:#e4b982}.example-design-top{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:21px}.example-index{font-size:32px;line-height:1;font-family:Georgia,serif;font-style:italic;color:color-mix(in srgb,var(--accent) 60%,transparent)}.example-path{display:flex;gap:6px;align-items:center;color:var(--accent);font-size:12px}.example-path svg{width:17px;height:17px}.example-design h3{font-size:33px;font-weight:500;letter-spacing:.025em;color:#edf4fb;margin:0 0 13px;overflow-wrap:anywhere}.example-subtitle{font-size:14px;line-height:1.8;color:#b0c5d8;margin:0;min-height:76px}.example-counts{display:flex;gap:7px;flex-wrap:wrap;padding:16px 0 22px}.example-counts span{font-size:11px;color:var(--accent);border:1px solid color-mix(in srgb,var(--accent) 22%,transparent);padding:5px 7px}.example-chain{counter-reset:chain;padding:0;margin:0 0 22px;list-style:none}.example-chain li{position:relative;padding:0 0 21px 30px;color:#b0c5d8;font-size:13px;line-height:1.9;counter-increment:chain}.example-chain li:before{content:counter(chain);position:absolute;left:0;top:1px;width:19px;height:19px;border:1px solid color-mix(in srgb,var(--accent) 45%,transparent);border-radius:50%;font-size:10px;text-align:center;line-height:18px;color:var(--accent);background:#0b1b2b;z-index:1}.example-chain li:not(:last-child):after{content:'';position:absolute;top:21px;left:9px;bottom:0;border-left:1px solid color-mix(in srgb,var(--accent) 24%,transparent)}.example-chain li:last-child{padding-bottom:0}.example-design details{border-top:1px solid #91b0cb25}.example-design summary{padding:13px 0;color:var(--accent);font-size:13px;line-height:1.5;cursor:pointer}.example-design summary span{color:#7993ad;margin-left:8px}.example-innovation p,.example-reference-note{font-size:13px;line-height:1.9;color:#8eabc2;margin:0 0 16px}.example-sources a{display:block;text-decoration:none;border-left:1px solid #7f9bb841;padding:0 0 0 12px;margin:0 0 17px}.example-sources a strong{display:block;color:#c6dceb;font-size:13px;font-weight:500}.example-sources a span{display:block;color:#7e9db8;font-size:12px;line-height:1.9;margin-top:5px}.example-load{margin-top:14px}.example-load .btn{width:100%;justify-content:space-between;display:flex;align-items:center;color:var(--accent);border-color:color-mix(in srgb,var(--accent) 35%,transparent);background:color-mix(in srgb,var(--accent) 7%,#0e1b2c);font-size:14px;padding:13px 16px}.example-load svg{height:18px;width:18px}.example-load .btn:hover{background:color-mix(in srgb,var(--accent) 17%,#0e1b2c)}.example-beginners{margin-top:27px;border-top:1px solid #c1d8e528}.example-beginners>summary{padding:20px 0;color:#88a8c3;font-size:14px;cursor:pointer}.example-beginners>div{display:grid;grid-template-columns:repeat(3,1fr);gap:15px}.example-beginners article{border:1px solid #789db12c;padding:18px}.example-beginners strong{font-size:15px;color:#b5cfe1}.example-beginners p{font-size:13px;color:#7c9ab5;line-height:1.7}.examples-dialog summary:focus-visible,.examples-dialog button:focus-visible,.examples-dialog a:focus-visible{outline:2px solid #b6dcf5;outline-offset:4px}@media(max-width:1000px){.example-design-grid{grid-template-columns:1fr}.example-subtitle{min-height:0}.example-design{padding:23px 26px}.example-chain{display:grid;grid-template-columns:1fr 1fr;gap:16px}.example-chain li{padding-bottom:0}.example-chain li:after{display:none}.example-design h3{font-size:29px}.example-design-top{margin-bottom:13px}}@media(max-width:600px){.examples-dialog{width:calc(100vw - 22px)}.examples-dialog .dialog-body{padding:18px 15px}.example-design{padding:20px}.example-chain{grid-template-columns:1fr}.example-beginners>div{grid-template-columns:1fr}.examples-intro h3{font-size:25px}}
