25 lines
2.4 KiB
CSS
25 lines
2.4 KiB
CSS
:root { color-scheme: dark; font-family: Inter, ui-sans-serif, system-ui, sans-serif; background: #090b10; color: #edf1f7; }
|
|
* { box-sizing: border-box; }
|
|
body { margin: 0; min-height: 100vh; background: radial-gradient(circle at 78% 15%, #16362d 0, transparent 30%), linear-gradient(145deg, #090b10, #0d1218); }
|
|
main { width: min(920px, calc(100% - 40px)); margin: 0 auto; padding: 9vh 0 8vh; }
|
|
.eyebrow { color: #7f8b9c; font-size: 11px; letter-spacing: .2em; display: flex; align-items: center; gap: 10px; }
|
|
.eyebrow span { width: 8px; height: 8px; border-radius: 99px; background: #5dffb2; box-shadow: 0 0 22px #5dffb2; }
|
|
h1 { margin: 28px 0 22px; font-size: clamp(48px, 8vw, 88px); line-height: .98; letter-spacing: -.055em; font-weight: 580; }
|
|
h1 em { font-style: normal; color: #76efb5; }
|
|
.lede { max-width: 760px; color: #aab4c2; font-size: clamp(17px, 2.2vw, 21px); line-height: 1.58; }
|
|
code { color: #76efb5; }
|
|
.card { margin-top: 48px; padding: 28px; border: 1px solid #27323e; border-radius: 18px; background: rgba(14, 18, 25, .82); box-shadow: 0 26px 80px #0008; }
|
|
.card-head { display: flex; justify-content: space-between; gap: 20px; align-items: flex-start; }
|
|
.card-head small { display: block; color: #728094; letter-spacing: .14em; }
|
|
.card-head strong { display: block; margin-top: 8px; font-size: 28px; }
|
|
.pulse { color: #67f6ad; border: 1px solid #32634d; background: #10281f; border-radius: 99px; padding: 8px 12px; font: 11px ui-monospace, monospace; }
|
|
.policy { margin: 26px 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); border: 1px solid #202a35; border-radius: 12px; overflow: hidden; }
|
|
.policy div { padding: 16px; border: 1px solid #202a35; }
|
|
.policy span { display: block; color: #728094; font-size: 11px; text-transform: uppercase; letter-spacing: .1em; }
|
|
.policy b { display: block; margin-top: 7px; font-size: 14px; }
|
|
button { width: 100%; border: 0; border-radius: 10px; padding: 15px 18px; background: #70efb2; color: #07120d; font: 700 14px ui-monospace, monospace; cursor: pointer; }
|
|
button:disabled { opacity: .5; cursor: wait; }
|
|
pre { min-height: 74px; margin: 14px 0 0; padding: 16px; border-radius: 10px; background: #080a0e; color: #96a4b7; white-space: pre-wrap; overflow: auto; font-size: 12px; }
|
|
.foot { color: #687588; font-size: 12px; margin-top: 20px; }
|
|
@media (max-width: 620px) { .policy { grid-template-columns: 1fr; } .card { padding: 20px; } }
|