@charset "UTF-8";
/* Hiro24 v2 — warm craftsmanship / quiet technology. No remote fonts or UI assets. */
:root {
  --navy:#081a24; --deep:#041019; --ink:#17282e; --muted:#617078;
  --orange:#f58b22; --orange-dark:#a34d0b; --amber:#ffc467; --cyan:#6ed4dd;
  --green:#70deb6; --paper:#faf9f6; --line:#deded7; --radius:16px;
  --font:-apple-system,BlinkMacSystemFont,"Avenir Next","Segoe UI","Hiragino Kaku Gothic ProN","Noto Sans JP","Yu Gothic",sans-serif;
  --display:"Iowan Old Style","Palatino Linotype","Hiragino Mincho ProN","Yu Mincho",Georgia,serif;
  --mono:"SFMono-Regular",Consolas,"Liberation Mono",monospace;
}
* {box-sizing:border-box}
html {scroll-behavior:smooth;scroll-padding-top:30px}
body {margin:0;background:var(--paper);color:var(--ink);font:15px/1.8 var(--font);-webkit-font-smoothing:antialiased}
a {color:inherit;text-decoration:none}
a:hover {color:var(--orange-dark)}
button,input,select,textarea {font:inherit}
button,a,summary,input,select,textarea {-webkit-tap-highlight-color:transparent}
button,summary {cursor:pointer}
button:disabled {cursor:not-allowed;opacity:.5}
img {display:block;max-width:100%}
h1,h2,h3,p {margin-top:0}
h1,h2,h3 {line-height:1.4;letter-spacing:-.025em}
p {margin-bottom:1em}
a:focus-visible,button:focus-visible,summary:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible {outline:3px solid #df7918;outline-offset:5px}
.container {max-width:1360px;margin-inline:auto;padding-inline:48px}
.narrow {max-width:900px}
.icon {width:22px;height:22px;flex-shrink:0;vertical-align:middle}
.mono {font:11px var(--mono);letter-spacing:.04em}
.eyebrow {font:10px/1.7 var(--mono);letter-spacing:.19em;color:var(--orange-dark);font-weight:600}
.skip {position:fixed;top:10px;left:20px;background:#fff;padding:12px;z-index:100;clip-path:inset(50%);width:1px;height:1px;overflow:hidden;white-space:nowrap}
.skip:focus {clip-path:none;width:auto;height:auto;overflow:visible}

/* Header */
.site-header {background:var(--deep);color:#eef2f1;border-bottom:1px solid #ffffff20;position:relative;z-index:20}
.header-inner {min-height:88px;display:flex;align-items:center;justify-content:space-between;gap:26px}
.brand {display:flex;align-items:center;gap:13px;white-space:nowrap;font-size:20px;line-height:1.25;font-weight:680;letter-spacing:-.7px}
.brand:hover {color:#fff}
.brand>.icon {width:34px;height:34px;color:var(--orange);stroke-width:2;filter:drop-shadow(0 0 9px #f58b2230)}
.brand b {font-weight:300;color:#80959d;margin-inline:3px}
.brand small {display:block;font-size:10px;font-weight:400;letter-spacing:.15em;color:#a8bdc4;margin-top:6px}
.desktop-nav {display:flex;align-items:center;gap:26px;height:88px;font-size:13px;white-space:nowrap;margin-left:auto}
.desktop-nav a {height:100%;display:flex;align-items:center;position:relative}
.desktop-nav a:hover,.desktop-nav a[aria-current] {color:#ffce8e}
.desktop-nav a::after {position:absolute;content:"";height:2px;background:var(--orange);bottom:24px;left:0;right:100%;transition:right .2s}
.desktop-nav a:hover::after,.desktop-nav a[aria-current]::after {right:0}
.header-actions {display:flex;align-items:center;gap:20px}
.commission-link {display:flex;align-items:center;gap:8px;padding:8px 18px;border:1px solid #ffc875;background:linear-gradient(115deg,#ffbd54,#f38a20);color:#22180c;border-radius:30px;box-shadow:inset 0 1px 0 #ffe0aa99,0 0 20px #f18a2015;font-weight:700;font-size:12px;white-space:nowrap;transition:box-shadow .2s}
.commission-link:hover {color:#22180c;box-shadow:inset 0 1px 0 #ffe0aa,0 0 24px #f18a2040}
.commission-link .icon {width:16px;height:16px}
.language {position:relative;font-size:11px}
.language summary {display:flex;align-items:center;gap:7px;list-style:none;min-height:44px;white-space:nowrap}
.language summary::-webkit-details-marker,.mobile-menu summary::-webkit-details-marker {display:none}
.language .icon {width:16px;height:16px}
.language .icon:last-child {width:10px}
.language-list {position:absolute;top:49px;right:0;width:178px;padding:8px;background:#102631;border:1px solid #38505b;box-shadow:0 18px 45px #0007;border-radius:10px}
.language-list a {display:block;padding:8px 12px;border-radius:5px}
.language-list a:hover,.language-list a[aria-current] {background:#223b47;color:#ffd29d}
.mobile-menu {display:none}

/* Button family: amber primary, translucent outline, divided arrow. */
.button {display:inline-flex;align-items:center;justify-content:center;gap:11px;position:relative;overflow:hidden;min-height:50px;padding:0 0 0 20px;border:1px solid #e98b2c;border-top-color:#ffce86;border-radius:9px;color:#211a11;background:linear-gradient(110deg,#ffc363 0%,#f7a139 48%,#ef851a 100%);font-size:13px;font-weight:720;box-shadow:inset 0 1px 0 #ffe3acbb,0 4px 0 #aa510d16,0 7px 18px #d7771418;transition:transform .2s,box-shadow .2s,filter .2s}
.button::before {content:"";position:absolute;inset:0;transform:translateX(-120%);background:linear-gradient(110deg,transparent,#fff4,transparent);pointer-events:none;transition:transform .65s}
.button:hover {color:#19150e;transform:translateY(-2px);box-shadow:inset 0 1px 0 #ffe7b8,0 8px 26px #d7771430}
.button:hover::before {transform:translateX(120%)}
.button .button-icon {width:18px;height:18px}
.button-end {display:grid;place-items:center;align-self:stretch;min-width:43px;margin-left:7px;border-left:1px solid #7f4c2430;padding:0 12px}
.button-end>.icon {width:18px;height:18px;transition:transform .2s}
.button:hover .button-end>.icon {transform:translateX(3px)}
.button.secondary {background:linear-gradient(120deg,#ffffff0e,#ffffff03);border:1px solid #80949b;color:inherit;box-shadow:inset 0 1px 0 #ffffff15,0 4px 20px #0001;backdrop-filter:blur(8px)}
.button.secondary .button-end {border-left-color:#c3d9df30}
.button.secondary:hover {border-color:#d9e6e5;background:#ffffff12;box-shadow:0 8px 24px #0002}
.text-link {display:inline-flex;align-items:center;gap:10px;font-size:12px;font-weight:600;line-height:1.6}
.text-link .icon {width:16px;height:16px;transition:transform .2s}
.text-link:hover .icon {transform:translateX(4px)}

/* Night workshop */
.hero {position:relative;background:#050f18;color:#fdf9f0;overflow:hidden}
.hero-image {position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center}
.hero::after {content:"";position:absolute;inset:0;background:linear-gradient(0deg,#041019dd 0%,transparent 20%),linear-gradient(90deg,#04101935,transparent 68%);pointer-events:none}
.hero-inner {position:relative;z-index:1;padding-top:55px;padding-bottom:0;min-height:650px;display:flex;flex-direction:column}
.hero-copy {max-width:640px;position:relative;padding-bottom:32px}
.hero-eyebrow {font:10px/1.8 var(--mono);letter-spacing:.14em;display:flex;align-items:center;gap:12px;color:#c6d7d8;margin-bottom:24px}
.hero-eyebrow>span {width:25px;height:1px;background:var(--orange)}
.hero h1 {font-family:var(--display);font-size:clamp(43px,4.7vw,66px);font-weight:650;line-height:1.35;letter-spacing:.02em;margin:0 0 22px;text-wrap:balance}
.hero em {font-style:normal;color:var(--amber);text-shadow:0 2px 25px #ffad2630}
html:lang(en) .hero h1 {font-size:clamp(42px,4.1vw,58px);letter-spacing:-.015em;line-height:1.4}
.hero-copy>p {font-size:14px;line-height:2.1;letter-spacing:.04em;max-width:435px;color:#d5dddb;margin-bottom:25px;text-wrap:pretty}
.hero-buttons {display:flex;gap:14px;flex-wrap:wrap}
.hero .button {min-height:52px;font-size:13px}
.hero .button.secondary {color:#edf3f1}
.hero-status {display:flex;gap:30px;align-items:center;border-top:1px solid #b6d3d333;min-height:68px;margin-top:auto;font:10px/1.7 var(--mono);color:#acbec5;width:100%}
.hero-status>span {display:flex;align-items:center;gap:10px;white-space:nowrap}
.hero-status i,.waiting-dot {width:6px;height:6px;background:#91a4ad;border-radius:50%;display:inline-block;flex-shrink:0}
.hero-status b {font-weight:500;color:#fbc67c}
.hero-status>span:nth-child(2) {padding-left:25px;border-left:1px solid #ffffff26}
.hero-origin {font-size:8px;letter-spacing:.1em;color:#a8bac1}
.hero-status>a {margin-left:auto;display:flex;align-items:center;gap:10px;font-size:8px;letter-spacing:.12em;color:#c3d3d4}
.hero-status>a>.icon {width:13px;height:13px;transform:rotate(90deg)}
.hero-corner {position:absolute;right:48px;bottom:102px;font:8px/1.7 var(--mono);letter-spacing:.18em;text-align:right;color:#ecd5b4;display:grid;gap:6px;text-shadow:0 1px 8px #000}

/* Section typography */
.section {padding:64px 0}
.section-heading {display:flex;align-items:center;gap:26px;margin-bottom:12px}
.section-heading-title {display:flex;align-items:center;gap:15px;min-width:0}
.section-number {font:10px var(--mono);color:var(--orange-dark);padding:3px 9px 3px 0;border-right:2px solid var(--orange);align-self:center}
.section-heading h2 {font-size:36px;font-family:var(--display);font-weight:650;margin:0;display:flex;align-items:center;gap:20px;white-space:nowrap}
.section-heading h2 small {font:12px/1.5 var(--font);letter-spacing:.035em;color:var(--muted);white-space:normal}
.section-heading h2 small::before {content:"/";margin-right:20px;color:#9fa69f}
.heading-line {height:1px;background:var(--line);flex:1;min-width:20px}
.section-heading>.text-link {font-size:11px;white-space:nowrap}
.section-intro {font-size:13px;color:var(--muted);margin:0 0 28px 43px;line-height:1.9}
.projects-section .section-heading {margin-bottom:28px}
.projects-section {background:linear-gradient(180deg,#faf9f6,#f5f5f0)}
.featured-grid {display:grid;grid-template-columns:1fr 1fr;gap:25px}
.featured-project {border:1px solid #dddcd3;border-radius:var(--radius);overflow:hidden;box-shadow:0 4px 8px #16252b04,0 20px 40px #182b3210;display:flex;flex-direction:column;transition:transform .3s,box-shadow .3s}
.featured-project:hover {transform:translateY(-3px);box-shadow:0 15px 40px #182b3218}
.featured-image-link {display:block;overflow:hidden}
.app-visual {height:282px;position:relative;overflow:hidden;isolation:isolate}
.visual-overline {display:flex;align-items:center;justify-content:space-between;position:absolute;left:27px;right:27px;top:21px;font:9px var(--mono);letter-spacing:.18em;z-index:3}
.visual-overline .icon {width:16px;height:16px}
.tabiji-visual {background:radial-gradient(ellipse at 80% 20%,#fcf6df,transparent 65%),linear-gradient(120deg,#d7e1d4,#e9e2ca);color:#35574e}
.tabiji-visual::before {content:"";position:absolute;inset:0;opacity:.25;background-image:linear-gradient(#ffffffaa 1px,transparent 1px),linear-gradient(90deg,#ffffffaa 1px,transparent 1px);background-size:44px 44px;transform:rotate(-14deg) scale(1.4);mask-image:linear-gradient(90deg,black,transparent)}
.browser-frame {position:absolute;left:7%;right:14%;top:64px;border-radius:10px;background:#fffaf0;border:1px solid #fff;box-shadow:0 20px 35px #263d4a38,0 3px 8px #263d4a20;transform:perspective(950px) rotateY(-6deg) rotateX(3deg) rotateZ(-2deg);overflow:hidden;transition:transform .5s}
.featured-project:hover .browser-frame {transform:perspective(950px) rotateY(-2deg) rotateX(1deg) rotateZ(-1deg)}
.browser-bar {display:flex;align-items:center;gap:4px;padding:8px 10px;background:#f6f4e9;border-bottom:1px solid #dfddd1}
.browser-bar i {width:5px;height:5px;border-radius:50%;background:#b9c8be}
.browser-bar i:first-child {background:#daab86}.browser-bar i:nth-child(2) {background:#dbc990}
.browser-bar span {font:7px var(--mono);margin-left:auto;color:#5d746b}
.browser-frame>img {width:100%;height:auto}
.phone-frame {position:absolute;right:6%;top:94px;width:21%;max-width:118px;border:5px solid #304942;border-radius:17px;background:#304942;box-shadow:0 12px 25px #2435274a;transform:rotate(4deg);overflow:hidden;transition:transform .5s}
.phone-frame>img {width:100%;height:auto}
.featured-project:hover .phone-frame {transform:rotate(1deg) translateY(-3px)}
.visual-caption {position:absolute;bottom:13px;left:27px;font:7px/1.4 var(--mono);letter-spacing:.18em;z-index:3}
.tabiji-visual .visual-caption {color:#234e42;background:#edf1e4f0;padding:4px 7px;border-radius:3px;letter-spacing:0;font-size:8px;right:14px;width:max-content;max-width:calc(100% - 40px)}
.cheers-visual {background:radial-gradient(ellipse at 75% 60%,#332a16 0%,#141814 35%,#080c0d 73%);color:#e8d9ad}
.cheers-wordmark {position:absolute;left:27px;top:67px;width:173px;height:auto;z-index:3}
.cheers-motto {position:absolute;left:28px;top:121px;font:29px/1.3 var(--display);color:#fff9e9;z-index:3;letter-spacing:-.01em}
.cheers-motto em {font-style:normal;color:#d7b566}
.cheers-host {position:absolute;height:92%;width:49%;right:-3%;bottom:-14%;object-fit:contain;opacity:.9;z-index:2;filter:sepia(.28);transition:transform .5s}
.featured-project:hover .cheers-host {transform:translateY(-5px)}
.cheers-orbit {position:absolute;width:260px;height:260px;right:8%;top:39px;border:1px solid #c3a4662b;border-radius:50%;box-shadow:inset -27px -17px 50px #000c,0 0 55px #b8a36512;overflow:hidden;background:radial-gradient(circle at 33% 28%,#234641,#102323 50%,#020a0b)}
.cheers-orbit>img {width:520px;max-width:none;height:210px;margin:28px 0 0 -165px;opacity:.45;filter:sepia(1) saturate(.8)}
.cheers-visual .visual-caption {color:#cfb878}
.featured-body {padding:25px 29px 20px;display:flex;flex-direction:column;flex:1}
.tabiji-project {background:#fffdf7}
.cheers-project {background:#101a1d;color:#f0eee4;border-color:#273237}
.project-meta {display:flex;justify-content:space-between;align-items:center;gap:12px;font:8px/1.7 var(--mono);letter-spacing:.1em;color:#607369}
.cheers-project .project-meta {color:#b7b7a4}
.featured-body h3 {font-family:var(--display);font-size:31px;letter-spacing:-.02em;margin:13px 0 8px;font-weight:650}
.feature-tagline {font-size:16px;line-height:1.7;font-weight:600;margin:0 0 8px;text-wrap:pretty}
.feature-description {font-size:13px;line-height:1.9;color:#65726c;margin:0 0 13px;max-width:490px}
.cheers-project .feature-description {color:#b1bebc}
.feature-tags {display:flex;gap:6px;flex-wrap:wrap;margin:0 0 21px}
.feature-tags>span {font-size:9px;line-height:1.6;border:1px solid #d8e0d5;border-radius:4px;padding:3px 7px;color:#4e6a5f}
.cheers-project .feature-tags>span {color:#d6c9a9;border-color:#495044}
.featured-actions {display:flex;align-items:center;gap:24px;margin-top:auto}
.featured-actions .button {font-size:11px;min-height:43px;padding-left:16px;border-radius:7px}
.featured-actions .text-link {font-size:11px}
.tabiji-project .button {background:linear-gradient(115deg,#356c5b,#1d5046);border-color:#386b5c;border-top-color:#709982;color:#fffbea;box-shadow:inset 0 1px 0 #b6d6bd22,0 5px 15px #23493c1a}
.tabiji-project .button-end {border-left-color:#b1cfbb44}
.cheers-project .button {background:linear-gradient(115deg,#f4dd9b,#c7953b);border-color:#e9c77d;color:#271f10}
.cheers-project .text-link {color:#e5d2a6}
.status {display:inline-flex;align-items:center;gap:5px;font:9px/1.5 var(--mono);text-transform:uppercase;letter-spacing:.07em;padding:4px 8px;border-radius:4px;font-weight:600;background:#e6e8e5;color:#52605f;white-space:nowrap}
.status::before {content:"";height:4px;width:4px;border-radius:50%;background:currentColor}
.released {color:#22674e;background:#e5f1e4}
.cheers-project .released {color:#96d0a6;background:#1f332a}
.beta {background:#e1edf3;color:#286885}.experiment {background:#eee5f4;color:#77568d}.planning {background:#eceee9;color:#5d6964}
.data-line {border-top:1px solid #dfe3d8;margin-top:19px;padding-top:12px;font-size:10px;line-height:1.8;color:#68756c;display:flex;align-items:flex-start;gap:8px}
.cheers-project .data-line {border-top-color:#34413b;color:#a4b2ad}
.review-tag {display:inline-block;color:#8a511b;background:#fff1d8;border:1px solid #d8b984;font:8px/1.6 var(--font);border-radius:3px;padding:1px 5px;white-space:nowrap;flex-shrink:0}
.cheers-project .review-tag {background:#3a3021;color:#efd39c;border-color:#6f5837}
.workbench-heading {display:flex;align-items:center;gap:19px;margin:34px 0 18px}
.workbench-heading p {margin:0;color:#5c6b65;font-size:12px}
.workbench-heading .eyebrow {font-size:9px;color:#516b61;white-space:nowrap}
.project-grid {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
.project-card {position:relative;background:#fffdfa;border:1px solid #e2e1d9;border-radius:12px;overflow:hidden;display:grid;grid-template-columns:36% minmax(0,1fr);box-shadow:0 3px 6px #15293604;transition:border-color .2s,transform .2s}
.project-card:hover {border-color:#c7ae8e;transform:translateY(-3px)}
.art-link {display:block;position:relative;overflow:hidden;background:#102027}
.project-art {position:relative;height:100%;overflow:hidden;background:#0b212a}
.project-art>img {width:100%;height:100%;object-fit:cover;transition:transform .6s}
.art-link:hover .project-art>img,.note-thumb:hover .project-art>img {transform:scale(1.045)}
.art-caption {position:absolute;bottom:8px;left:7px;right:7px;color:#e3e5df;background:#07192299;border-radius:3px;font-size:7px;text-align:center;padding:2px 3px}
.project-content {padding:16px 15px 14px;min-width:0}
.project-content h3 {font-size:13px;margin:10px 0 7px;line-height:1.6;letter-spacing:-.02em}
.project-content>p {font-size:12px;line-height:1.8;margin-bottom:10px;color:#627068;min-height:3.6em}
.project-content .project-meta {font-size:8px;gap:5px;flex-wrap:wrap}
.project-content .status {font-size:7px;padding:2px 5px}
.small-project-link {display:flex;align-items:center;justify-content:space-between;font-size:10px;color:#9d5a25}
.small-project-link>.icon {width:13px;height:13px}
.project-content .data-line {font-size:9px;flex-direction:column;gap:5px;margin-top:11px;padding-top:9px}
.project-footnote {margin:18px 0 0;font-size:10px;color:#6f7a72;text-align:right}

/* Real security telemetry. Decorative geography carries no fabricated events. */
.defense-section {background:radial-gradient(ellipse at 48% 40%,#12323e 0%,#091c27 48%,#06151f 100%);color:#e8f0ef;padding:57px 0 29px;position:relative;border-block:1px solid #28414c}
.defense-section::before {content:"";position:absolute;inset:0;pointer-events:none;background-image:radial-gradient(#c4dfe409 .6px,transparent .6px);background-size:4px 4px}
.defense-section>.container {position:relative}
.defense-section .section-heading h2 small {color:#bcced2}
.defense-section .section-number {color:#f5b46b}
.defense-section .heading-line {background:#45606b66}
.defense-section .text-link {color:#efbd7d}
.defense-lead {font-size:13px;color:#b7cbd0;margin:0 0 26px 43px;max-width:940px}
.period-toolbar {display:flex;align-items:center;flex-wrap:wrap;gap:14px;padding:14px 18px;background:#132b36a6;border:1px solid #3b5663;border-radius:9px;font-size:11px;box-shadow:inset 0 1px 0 #ffffff05}
.period-toolbar label {color:#c4d7dd}
.period-toolbar select {background:#0a1e29;border:1px solid #5a7179;color:#eff5f4;border-radius:5px;font-size:12px;padding:8px 28px 8px 12px;max-width:100%}
.period-total {margin-left:auto;color:#bfd0d6}
.period-total strong {color:#ffd293;font:19px/1.5 var(--mono);margin-left:15px}
.period-message {width:100%;color:#afc4cc;font-size:10px;min-height:1.7em;padding-top:8px;border-top:1px solid #ffffff0c}
.connection-bar {display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;margin:13px 3px 0;font:9px/1.8 var(--mono);color:#9ab4c0}
.connection-status {display:flex;align-items:center;gap:7px}
.connection-status i {height:5px;width:5px;background:#8199a4;border-radius:50%}
.connection-status[data-connected="true"] i {background:#6bdbb4;box-shadow:0 0 10px #5ad2aa55}
.defense-dashboard {display:grid;grid-template-columns:195px minmax(0,1fr) 195px;gap:25px;align-items:center;margin:22px 0 26px}
.metrics {border:1px solid #3a5766;border-radius:9px;background:linear-gradient(140deg,#15313d88,#091e29a6);padding:2px 17px;box-shadow:inset 0 1px 0 #ffffff06,0 10px 25px #0001}
.metric {display:flex;align-items:center;gap:16px;padding:14px 0;border-bottom:1px solid #54717d3d}
.metric:last-child {border:0}
.metric>.icon {width:25px;height:25px;color:#d0e6e9;stroke-width:1.4}
.metric>div {display:flex;flex-direction:column;min-width:0}
.metric span {font-size:11px;color:#b6cdd7}
.metric strong {font:15px/1.65 var(--mono);color:#ffc47b;margin-top:3px;overflow-wrap:anywhere}
.metric strong.has-value {font-size:26px}
.world-map {min-width:0;position:relative;aspect-ratio:720/340;display:flex;align-items:center}
.world-map::before {content:"";position:absolute;inset:15% 0;border-radius:50%;background:radial-gradient(ellipse,#1f678432,transparent 68%);pointer-events:none}
.world-map>img {position:relative;width:100%;height:auto;filter:drop-shadow(0 0 4px #62d5e443);opacity:.9}
.map-grid {position:absolute;inset:8% 0;background-image:linear-gradient(#80adc50c 1px,transparent 1px),linear-gradient(90deg,#80adc50c 1px,transparent 1px);background-size:32px 32px;mask-image:radial-gradient(ellipse,black,transparent 70%)}
.map-events {position:absolute;width:100%;height:100%;inset:0}
.map-caption {position:absolute;bottom:-4px;width:100%;display:flex;gap:7px;align-items:center;justify-content:center;flex-wrap:wrap;font-size:9px;color:#b2c6cf}
.map-caption .mono {font-size:7px;margin-left:6px;letter-spacing:.12em;color:#8aaab9}
.map-pulse {fill:#ff9c30;stroke:#ffac4b;stroke-width:1;transform-box:fill-box;transform-origin:center;animation:ripple 2.4s ease-out forwards}
.map-country {fill:#77dce4;opacity:.8;stroke:#c0f2f6;stroke-width:.5}
.map-spark {fill:#fff1c6;filter:drop-shadow(0 0 5px #f99323)}
@keyframes ripple {0%{r:3;opacity:.9}100%{r:25;opacity:0}}
.defense-system {border:1px solid #3a5766;border-radius:9px;padding:20px 17px;background:linear-gradient(140deg,#15313d66,#091e2980)}
.defense-system .eyebrow {color:#eccb9c;font-size:9px;letter-spacing:.15em}
.defense-system>div {display:flex;align-items:center;gap:12px;padding:15px 0;border-bottom:1px solid #54717d3d;font-size:11px;line-height:1.7}
.defense-system>div>.icon {color:#b2d6de;stroke-width:1.5}
.defense-system>a {display:flex;align-items:center;justify-content:space-between;font-size:10px;color:#e6c998;padding-top:14px}
.defense-system>a>.icon {width:14px}
.logs-wrap {border:1px solid #395563;background:#0c222dd6;border-radius:9px;display:grid;grid-template-columns:180px minmax(0,1fr);padding:18px}
.logs-title {display:flex;flex-direction:column;justify-content:center;padding:0 12px;border-right:1px solid #3e5963}
.logs-title h3 {font-size:12px;margin:0 0 8px;letter-spacing:.02em}
.logs-title .mono {font-size:8px;letter-spacing:.18em;color:#94b1bf}
.table-scroll {overflow:auto;min-width:0;padding-left:20px}
.defense-table {width:100%;border-collapse:collapse;font-size:11px;white-space:nowrap;text-align:left}
.defense-table th {font-size:8px;color:#9ab4c1;font-weight:400;text-transform:uppercase;letter-spacing:.04em;padding:0 10px 7px;border-bottom:1px solid #34515f}
.defense-table td {padding:7px 10px;border-bottom:1px solid #ffffff0b;font-family:var(--mono)}
.defense-table td:nth-child(3) {font-family:var(--font)}
.defense-table .logs-empty {text-align:center;height:57px;color:#b4c8d1;font-family:var(--font);white-space:normal;font-size:12px}
.blocked {background:#69e6bb;color:#07382e;font:8px var(--mono);padding:2px 5px;border-radius:3px}
.new-log {animation:highlight 4s ease-out}
@keyframes highlight {from{background:#e9962133}to{background:transparent}}
.defense-foot {display:flex;gap:17px;align-items:flex-start;flex-wrap:wrap;font-size:9px;color:#a0bac6;padding:15px 3px 0;line-height:1.9}
.defense-foot p {margin:0;flex:1;min-width:250px}
.defense-foot .coverage-note {color:#8ea9b6}
.defense-foot>a {color:#b3c9d1;font-size:8px}

/* Principles, notes, and the invitation */
.principles {padding-bottom:48px;background:#faf9f6}
.principles-grid {display:grid;grid-template-columns:repeat(3,1fr);gap:0;margin-top:30px}
.principles-grid article {display:flex;gap:20px;padding:10px 28px;border-right:1px solid #dcded7}
.principles-grid article:first-child {padding-left:0}
.principles-grid article:last-child {padding-right:0;border:0}
.principle-icon {display:grid;place-items:center;width:47px;height:56px;color:#d97b21;flex-shrink:0}
.principle-icon>.icon {width:39px;height:39px;stroke-width:1.35}
.principle-number {font:8px var(--mono);letter-spacing:.1em;color:#998367;display:block;margin-bottom:7px}
.principles-grid h3 {font-size:17px;margin-bottom:8px;font-weight:650}
.principles-grid p {font-size:12px;line-height:1.9;margin:0;color:#65736c}
.notes-section {padding-top:28px;background:#faf9f6}
.notes-grid {display:grid;grid-template-columns:repeat(3,1fr);gap:25px}
.note-card {border:1px solid #e1e2da;border-radius:12px;background:#fffdf9;overflow:hidden;transition:transform .25s,box-shadow .25s}
.note-card:hover {transform:translateY(-3px);box-shadow:0 14px 30px #152b3410}
.note-thumb {display:block;position:relative;overflow:hidden}
.note-thumb .project-art {height:176px}
.note-thumb .project-art::after {content:"";position:absolute;inset:0;background:linear-gradient(0deg,#04101988,transparent 50%);pointer-events:none}
.note-index {position:absolute;bottom:14px;left:20px;font:8px var(--mono);letter-spacing:.16em;color:#e7e5d6}
.note-content {padding:20px 22px 17px}
.note-card h3 {font-size:17px;line-height:1.65;margin:11px 0 21px;min-height:3.3em;font-weight:650;text-wrap:pretty}
.tags {display:flex;gap:7px;flex-wrap:wrap}
.tags>span {color:#687c73;font:8px/1.5 var(--mono);letter-spacing:.02em}
.tags>span+span::before {content:"/";margin-right:7px;color:#b2bcb4}
.note-bottom {display:flex;align-items:center;justify-content:space-between;border-top:1px solid #e7e8e0;padding-top:13px}
.note-bottom>a {width:30px;height:30px;display:grid;place-items:center;border:1px solid #d9ded4;border-radius:50%;color:#52695c}
.note-bottom .icon {width:15px;height:15px}
.note-draft {font:8px/1.6 var(--mono);color:#846a43;letter-spacing:.03em}
.request-section {padding-top:8px;padding-bottom:65px}
.request-banner {border-radius:16px 16px 0 0;background:linear-gradient(90deg,#071721 5%,#071721e6 48%,#07172122),url('/assets/img/v2/kominka-hero.webp') 74% 64%/cover;color:#fff5e2;padding:35px 40px;position:relative;overflow:hidden}
.request-banner .eyebrow {color:#c5ac85;font-size:8px;letter-spacing:.2em}
.request-banner h2 {font:600 30px/1.5 var(--display);letter-spacing:.03em;margin:12px 0 0;position:relative;z-index:1}
.request-banner h2>span {display:inline-block}
.request-banner-mark {position:absolute;right:50px;top:30px;color:#f1bd7733}
.request-banner-mark .icon {width:110px;height:110px;stroke-width:.65}
.request-grid {display:grid;grid-template-columns:1fr 1fr;border:1px solid #daded5;border-top:0;border-radius:0 0 16px 16px;overflow:hidden;background:#fffdf8}
.request-card {padding:29px 40px 30px;position:relative;display:flex;flex-direction:column;align-items:flex-start}
.request-card.request {border-right:1px solid #dde1d5}
.request-card.commission {background:#f0f2eb}
.request-top {display:flex;align-items:center;justify-content:space-between;margin-bottom:12px;width:100%}
.request-top>.icon {color:#b47934;width:25px;height:25px;stroke-width:1.45}
.request-top .eyebrow {font-size:9px;letter-spacing:.16em;color:#82623a}
.request-card h3 {font-size:22px;margin:0 0 12px;font-weight:650}
.request-card p {font-size:13px;line-height:2;color:#66736a;margin-bottom:20px;max-width:480px}
.request-card .button {min-height:46px;font-size:12px;margin-top:auto}
.request-card .secondary {color:#4f6052;border-color:#a6b09d;background:transparent;box-shadow:inset 0 1px 0 #fff}
.request-card .secondary .button-end {border-left-color:#a6b09d66}
.request-card .secondary:hover {background:#ecf0e6}
.request-card small {display:block;margin-top:14px;font-size:9px;color:#6a756d;line-height:1.8}

/* Footer and secondary pages */
.site-footer {background:var(--deep);color:#a7b9bf;padding:39px 0 25px;border-top:1px solid #263c45}
.footer-top {display:flex;align-items:center;justify-content:space-between;gap:25px;padding-bottom:30px}
.footer-top .brand {color:#f2f4ed;font-size:18px}
.footer-top .brand>.icon {width:30px}
.footer-top nav {display:flex;flex-wrap:wrap;gap:23px;font-size:12px}
.site-footer a:hover {color:#ffd090}
.footer-bottom {border-top:1px solid #adcbd51c;padding-top:23px;display:flex;align-items:center;justify-content:space-between;gap:18px;flex-wrap:wrap}
.footer-bottom>.mono {font-size:9px;letter-spacing:.05em}
.footer-bottom>div {display:flex;gap:16px;font-size:9px}
.footer-bottom>small {font-size:8px}
.page-intro {background:radial-gradient(ellipse at 90% 10%,#233b3d,transparent 55%),var(--navy);color:#f7f4e9;padding:66px 0 52px;border-bottom:1px solid #31484c;position:relative;overflow:hidden}
.page-intro::after {content:"";position:absolute;right:-50px;bottom:-170px;width:400px;height:400px;border:1px solid #dfb37514;border-radius:50%;box-shadow:0 0 0 30px #dfb37508,0 0 0 60px #dfb37505;pointer-events:none}
.page-intro .eyebrow {color:#e9b578}
.page-intro h1 {font-family:var(--display);font-size:clamp(32px,4vw,52px);font-weight:600;margin:16px 0;position:relative;z-index:1}
.page-intro p {font-size:14px;max-width:760px;color:#b9cecf;margin-bottom:0}
.content-block {padding-top:40px;padding-bottom:65px}
.prose {font-size:14px;line-height:2;color:#607168}
.prose h2 {font-size:24px;color:var(--ink);margin-top:28px;font-weight:650}
.prose a:not(.button) {color:#9f5620;text-decoration:underline;text-underline-offset:5px}
.prose section {margin-bottom:32px}
.policy-nav {display:flex;gap:18px;flex-wrap:wrap;font-size:13px;border-bottom:1px solid var(--line);padding-bottom:25px;margin-bottom:35px}
.about-layout,.app-layout {display:grid;grid-template-columns:1.1fr 1fr;gap:50px;align-items:center}
.about-image img {height:360px;object-fit:cover;object-position:75%;border-radius:13px}
.app-art {border-radius:13px;overflow:hidden;border:1px solid #d8dfd2;box-shadow:0 12px 30px #1b343311}
.app-art>.project-art {height:340px}
.app-art>.app-visual {height:340px}
.app-art .phone-frame {width:22%;max-width:130px}
.app-art .cheers-host {width:50%}
.app-features {padding-left:20px;margin-bottom:23px}
.app-features li::marker {color:#b67831}
.app-links {display:flex;align-items:center;flex-wrap:wrap;gap:20px}
.app-links .text-link {font-size:12px}
.app-screenshot {max-width:1100px;margin-block:0 20px}
.app-screenshot>img {width:100%;height:auto;border:1px solid #b9c1b2;border-radius:10px;box-shadow:0 15px 45px #1b343314}
.app-screenshot figcaption {font-size:10px;color:#718074;margin-top:15px}
.data-panel {padding:27px;background:#fffdf7;border:1px solid #ddcfb3;border-radius:11px}
.data-panel h2 {margin-top:12px}
.faq {border-bottom:1px solid var(--line);padding:19px 0}
.faq summary {font-weight:600;color:var(--ink);padding-right:15px}
.faq p {margin:15px 0 5px;font-size:14px}
.notice-box {padding:24px;background:#fff3dd;border:1px solid #ddc499;border-radius:8px;margin:22px 0;color:#845011}
.forms-stack {padding-bottom:60px}
.form-section {scroll-margin-top:35px;border:1px solid #d6ddd3;background:#fffefa;border-radius:13px;padding:33px;margin:0 0 30px;box-shadow:0 10px 24px #122d2510}
.form-section h2 {font-size:22px}
.prose .form-section {margin-top:40px}
.form-row {display:grid;grid-template-columns:1fr 1fr;gap:18px}
.form-section label {display:block;font-size:12px;font-weight:600;color:#455c4f;margin-bottom:18px}
.form-section input:not([type=checkbox]),.form-section textarea {display:block;width:100%;border:1px solid #bac8bc;border-radius:6px;padding:12px;background:#f8faf5;color:var(--ink);margin-top:7px}
.form-section textarea {resize:vertical}
.form-section .checkbox {display:flex;gap:9px;align-items:flex-start;font-weight:400}
.checkbox input {margin-top:5px;accent-color:#9d6728}
.privacy-notice,.form-notice {font-size:11px;color:#617869;line-height:1.9}
.form-section button.button {padding:12px 22px}
.form-status {font-size:12px;color:#88632f;min-height:2em;margin:14px 0 0}
.honeypot {position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
[data-turnstile] {margin-bottom:16px}
.root-languages {display:flex;gap:15px;flex-wrap:wrap;margin:35px 0}
.root-languages a {border:1px solid #536a7b;padding:12px 20px;border-radius:6px}
.site-404 {padding:80px 20px;text-align:center}
.site-404>.button {padding:12px 22px}

/* Responsive composition */
@media(min-width:1600px) {
  .hero-inner {min-height:710px;padding-top:72px}
  .hero h1 {font-size:70px}
}
@media(max-width:1200px) {
  .container {padding-inline:32px}
  .brand {font-size:17px;gap:10px}
  .brand>.icon {width:29px}
  .header-inner {gap:20px;min-height:80px}
  .desktop-nav {gap:20px;height:80px;font-size:11px}
  .header-actions {gap:14px}
  .commission-link {padding:8px 13px;font-size:11px}
  .language summary>span {max-width:50px;overflow:hidden;text-overflow:ellipsis}
  .hero-inner {min-height:620px;padding-top:51px}
  .hero h1 {font-size:56px}
  .hero-copy {max-width:570px}
  .hero-corner {right:32px}
  .hero-origin {display:none!important}
  .app-visual {height:260px}
  .cheers-wordmark {width:155px}
  .cheers-motto {font-size:26px}
  .cheers-orbit {right:2%;width:235px;height:235px}
  .featured-body {padding:23px 25px 18px}
  .feature-tagline {font-size:15px}
  .project-grid {gap:16px}
  .project-card {grid-template-columns:1fr}
  .art-link .project-art {height:160px}
  .project-content {padding:16px 18px}
  .project-content h3 {font-size:15px;margin-top:10px}
  .project-content>p {font-size:11px;min-height:3.6em}
  .project-content .data-line {flex-direction:row;font-size:9px;min-height:4em}
  .defense-dashboard {grid-template-columns:180px minmax(0,1fr) 175px;gap:18px}
  .defense-system {padding:19px 13px}
  .metric {gap:12px}
  .metric strong {font-size:13px}
  .metrics {padding:2px 13px}
  .principles-grid article {gap:14px;padding-inline:23px}
  .principles-grid h3 {font-size:15px}
  .note-card h3 {font-size:15px}
  .note-thumb .project-art {height:158px}
  .request-card {padding:27px 30px}
}
@media(max-width:980px) {
  .desktop-nav {display:none}
  .header-actions {margin-left:auto}
  .mobile-menu {display:block}
  .mobile-menu summary {display:flex;align-items:center;justify-content:center;list-style:none;min-width:40px;min-height:44px}
  .mobile-menu nav {position:absolute;right:24px;top:72px;background:#102631;border:1px solid #38505b;padding:10px;min-width:220px;border-radius:10px;box-shadow:0 15px 35px #0007}
  .mobile-menu a {display:block;padding:11px 15px;font-size:14px;border-radius:5px}
  .mobile-menu a:hover {background:#223b47;color:#ffd29d}
  .hero-image {object-position:60%}
  .hero::after {background:linear-gradient(90deg,#041019cc,#04101955 60%,transparent),linear-gradient(0deg,#041019ee,transparent 30%)}
  .hero h1 {font-size:52px}
  .hero-corner {display:none}
  .section-heading h2 {font-size:31px;gap:14px}
  .section-heading h2 small {font-size:11px}
  .section-heading h2 small::before {margin-right:14px}
  .section-heading {gap:18px}
  .featured-grid {gap:20px}
  .app-visual {height:238px}
  .visual-overline {left:20px;right:20px;font-size:8px}
  .cheers-wordmark {left:20px;top:69px;width:145px}
  .cheers-motto {left:21px;top:113px;font-size:22px}
  .cheers-host {right:-9%;width:55%;opacity:.7}
  .cheers-orbit {right:-20%;opacity:.6}
  .visual-caption {left:20px;font-size:6px}
  .browser-frame {left:6%;right:10%;top:66px}
  .phone-frame {right:5%;top:111px;width:23%;border-width:4px;border-radius:13px}
  .featured-body {padding:20px}
  .featured-body h3 {font-size:28px}
  .feature-description {font-size:11px}
  .feature-tagline {font-size:14px}
  .featured-actions {gap:15px;flex-wrap:wrap}
  .featured-actions .text-link {font-size:10px}
  .data-line {font-size:8px;gap:6px}
  .project-content .data-line {flex-direction:column}
  .workbench-heading {gap:13px}
  .workbench-heading p {font-size:11px}
  .defense-dashboard {grid-template-columns:175px minmax(0,1fr)}
  .defense-system {grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;gap:14px;padding:15px 18px}
  .defense-system>.eyebrow {max-width:70px;font-size:8px}
  .defense-system>div {border:0;padding:0;font-size:10px;max-width:160px;gap:8px}
  .defense-system>a {display:none}
  .principles-grid article {gap:10px;padding-inline:18px}
  .principle-icon {width:33px}
  .principle-icon>.icon {width:31px}
  .principles-grid h3 {font-size:14px}
  .notes-grid {gap:18px}
  .note-content {padding:16px}
  .note-card h3 {font-size:14px}
  .note-thumb .project-art {height:142px}
  .request-card {padding:25px}
  .request-card h3 {font-size:20px}
  .footer-top {flex-direction:column;align-items:flex-start;gap:25px}
  .about-layout,.app-layout {gap:30px}
}
@media(max-width:700px) {
  body {font-size:14px}
  .container {padding-inline:22px}
  .header-inner {min-height:76px;gap:10px}
  .brand {font-size:14px;gap:8px;letter-spacing:-.4px;white-space:normal;max-width:245px}
  .brand>.icon {width:27px;height:27px}
  .brand small {font-size:8px;letter-spacing:.06em;margin-top:5px}
  .header-actions {gap:10px}
  .commission-link {display:none}
  .language summary>span {display:none}
  .language .icon {width:18px;height:18px}
  .language-list {right:-40px;top:46px;width:175px;font-size:13px}
  .mobile-menu summary {min-width:30px}
  .mobile-menu summary>.icon {width:22px}
  .mobile-menu nav {right:16px;top:68px}
  .hero-inner {min-height:680px;padding-top:43px}
  .hero-image {object-position:71% center}
  .hero::after {background:linear-gradient(90deg,#041019eb,#04101999 56%,#04101926),linear-gradient(0deg,#041019 0%,#04101933 33%,transparent 65%)}
  .hero-copy {max-width:none;width:100%}
  .hero-eyebrow {font-size:8px;letter-spacing:.065em;margin-bottom:23px;gap:9px}
  .hero-eyebrow>span {width:18px}
  .hero h1 {font-size:clamp(38px,8.8vw,55px);line-height:1.4;letter-spacing:.025em;margin-bottom:23px;text-wrap:initial}
  html:lang(en) .hero h1 {font-size:clamp(34px,8.8vw,48px);text-wrap:balance}
  .hero-copy>p {font-size:12px;line-height:2.05;max-width:340px;margin-bottom:25px;text-shadow:0 1px 8px #041019}
  .hero-buttons {gap:12px;flex-wrap:wrap}
  .hero .button {min-height:49px;font-size:11px;padding-left:14px;gap:8px}
  .button .button-icon {width:16px;height:16px}
  .button-end {min-width:34px;margin-left:2px;padding-inline:9px}
  .button-end>.icon {width:15px;height:15px}
  .hero-status {font-size:9px;gap:12px 20px;flex-wrap:wrap;padding-block:16px;min-height:86px;align-content:center}
  .hero-status>span {gap:7px}
  .hero-status>span:nth-child(2) {padding-left:18px}
  .hero-status>a {width:100%;margin-left:0;font-size:7px;letter-spacing:.14em}
  .section {padding:41px 0}
  .section-heading {gap:12px;margin-bottom:15px;align-items:center}
  .section-heading-title {gap:11px}
  .section-number {font-size:8px;padding-right:6px}
  .section-heading h2 {font-size:30px;display:block;line-height:1.2;white-space:normal}
  .section-heading h2 small {display:block;font-size:10px;line-height:1.7;margin-top:8px}
  .section-heading h2 small::before {display:none}
  .section-heading>.heading-line {min-width:0}
  .section-heading>.text-link {font-size:9px;gap:5px;align-self:flex-start;margin-top:9px}
  .section-heading>.text-link .icon {width:12px}
  .section-intro {margin:0 0 23px;font-size:11px;line-height:1.9}
  .featured-grid {grid-template-columns:1fr;gap:23px}
  .app-visual {height:270px}
  .visual-overline {left:24px;right:24px;top:21px;font-size:9px}
  .browser-frame {left:8%;right:15%;top:63px}
  .phone-frame {right:6%;top:92px;width:21%;max-width:118px;border-width:4px;border-radius:15px}
  .visual-caption {left:24px;font-size:7px}
  .cheers-wordmark {left:24px;top:68px;width:166px}
  .cheers-motto {left:25px;top:122px;font-size:29px}
  .cheers-host {right:-3%;width:50%;opacity:.86}
  .cheers-orbit {right:4%;opacity:1;width:245px;height:245px}
  .featured-body {padding:23px}
  .project-meta {font-size:8px}
  .featured-body h3 {font-size:30px;margin-top:13px}
  .feature-tagline {font-size:15px}
  .feature-description {font-size:13px;line-height:1.9}
  .feature-tags {gap:5px;margin-bottom:21px}
  .feature-tags>span {font-size:8px}
  .featured-actions {gap:21px}
  .featured-actions .button {font-size:11px;min-height:44px}
  .featured-actions .text-link {font-size:11px}
  .data-line {font-size:9px;gap:8px;line-height:1.8}
  .workbench-heading {flex-wrap:wrap;gap:7px 14px;margin:29px 0 17px}
  .workbench-heading .eyebrow {font-size:8px}
  .workbench-heading p {font-size:10px}
  .workbench-heading .heading-line {display:none}
  .project-grid {grid-template-columns:1fr;gap:14px}
  .project-card {grid-template-columns:34% minmax(0,1fr)}
  .art-link .project-art {height:100%;min-height:212px}
  .project-content {padding:16px 17px}
  .project-content h3 {font-size:14px;margin-top:9px}
  .project-content>p {font-size:11px;min-height:0;line-height:1.8}
  .project-content .project-meta {font-size:8px}
  .project-content .status {font-size:7px}
  .project-content .data-line {font-size:9px;min-height:0}
  .project-footnote {font-size:9px;text-align:left;line-height:1.8}
  .defense-section {padding:39px 0 25px}
  .defense-lead {font-size:11px;margin:0 0 20px;line-height:1.9}
  .period-toolbar {padding:13px;gap:10px;margin:0}
  .period-toolbar label {font-size:10px}
  .period-toolbar select {font-size:11px;padding:7px 23px 7px 8px}
  .period-total {font-size:10px;margin-left:0;width:100%;padding-top:5px}
  .period-total strong {font-size:17px;margin-left:10px}
  .period-message {font-size:9px}
  .connection-bar {font-size:8px;gap:7px 12px;line-height:1.8}
  .defense-dashboard {display:flex;flex-direction:column;gap:23px;margin:22px 0}
  .metrics {width:100%;display:grid;grid-template-columns:1fr 1fr;padding:0 15px;gap:0 22px}
  .metric {padding:14px 0;min-height:80px;gap:12px}
  .metric:nth-child(3) {border-bottom:0}
  .metric span {font-size:9px}
  .metric strong {font-size:14px}
  .metric>.icon {width:23px;height:23px}
  .metric strong.has-value {font-size:24px}
  .world-map {width:100%;aspect-ratio:720/360}
  .map-caption {font-size:8px;bottom:-7px;gap:5px}
  .map-caption .mono {font-size:6px;margin-left:0;letter-spacing:.05em}
  .defense-system {width:100%;padding:16px 12px;gap:10px}
  .defense-system>.eyebrow {display:none}
  .defense-system>div {flex:1;flex-direction:column;text-align:center;font-size:9px;gap:9px;max-width:none}
  .defense-system>div>.icon {height:23px;width:23px}
  .logs-wrap {display:block;padding:14px}
  .logs-title {padding:0 0 13px;flex-direction:row;justify-content:space-between;align-items:center;border:0}
  .logs-title h3 {font-size:11px;margin:0}
  .table-scroll {padding:0}
  .defense-table {font-size:9px}
  .defense-table th {font-size:8px;padding-inline:5px}
  .defense-table td {padding:7px 5px}
  .defense-table .logs-empty {height:60px;font-size:11px}
  .defense-foot {font-size:8px;gap:9px;line-height:1.9}
  .defense-foot p {min-width:100%}
  .defense-foot>a {font-size:8px}
  .principles {padding-bottom:22px}
  .principles-grid {grid-template-columns:1fr;gap:0;margin-top:20px}
  .principles-grid article,.principles-grid article:first-child,.principles-grid article:last-child {padding:22px 0;border-right:0;border-bottom:1px solid #dcded7;gap:22px}
  .principles-grid article:last-child {border-bottom:0}
  .principle-icon {width:44px;height:54px}
  .principle-icon>.icon {width:37px;height:37px}
  .principles-grid h3 {font-size:17px}
  .principles-grid p {font-size:12px;line-height:1.9}
  .notes-section {padding-top:15px}
  .notes-grid {grid-template-columns:1fr;gap:15px}
  .note-card {display:grid;grid-template-columns:33% minmax(0,1fr)}
  .note-thumb .project-art {height:100%}
  .note-index {font-size:6px;left:10px;bottom:11px}
  .note-content {padding:17px}
  .note-card h3 {font-size:14px;min-height:0;line-height:1.65;margin:8px 0 14px}
  .note-draft {font-size:7px}
  .note-bottom {padding-top:9px}
  .note-bottom>a {width:26px;height:26px}
  .tags>span {font-size:7px}
  .request-section {padding-top:0;padding-bottom:42px}
  .request-banner {padding:29px 24px;border-radius:12px 12px 0 0;background-position:69% center}
  .request-banner .eyebrow {font-size:7px;letter-spacing:.12em}
  .request-banner h2 {font-size:25px;line-height:1.55;margin-top:11px;max-width:300px}
  .request-banner-mark {right:5px;top:40px;opacity:.5}
  .request-grid {grid-template-columns:1fr;border-radius:0 0 12px 12px}
  .request-card {padding:26px 24px}
  .request-card.request {border-right:0;border-bottom:1px solid #dde1d5}
  .request-card h3 {font-size:21px}
  .request-card p {font-size:12px}
  .request-card .button {font-size:12px;min-height:46px;padding-left:17px}
  .request-card small {font-size:9px}
  .site-footer {padding:31px 0 24px}
  .footer-top {gap:26px;padding-bottom:25px}
  .footer-top .brand {font-size:16px;max-width:none}
  .footer-top nav {gap:13px 22px;font-size:11px}
  .footer-bottom {gap:19px}
  .footer-bottom>div {font-size:9px;gap:14px;flex-wrap:wrap}
  .footer-bottom>.mono {font-size:9px}
  .footer-bottom>small {width:100%;font-size:8px}
  .page-intro {padding:43px 0 37px}
  .page-intro h1 {font-size:33px;overflow-wrap:anywhere}
  .page-intro p {font-size:13px;line-height:1.9}
  .page-intro .eyebrow {font-size:9px}
  .about-layout,.app-layout {grid-template-columns:1fr;gap:25px}
  .about-image img {height:270px}
  .app-art>.project-art,.app-art>.app-visual {height:280px}
  .app-art .phone-frame {width:22%;max-width:118px}
  .app-screenshot {padding-inline:22px}
  .app-screenshot figcaption {font-size:9px}
  .content-block {padding-top:28px;padding-bottom:42px}
  .prose {font-size:13px}
  .prose h2 {font-size:22px}
  .form-section {padding:23px 19px}
  .form-section h2 {font-size:20px}
  .form-row {grid-template-columns:1fr;gap:0}
  .forms-stack {padding-bottom:32px}
  .form-section input:not([type=checkbox]),.form-section textarea {font-size:16px}
  .privacy-notice,.form-notice {font-size:11px}
  .policy-nav {gap:12px;font-size:11px}
  .data-panel {padding:22px}
  .faq {font-size:13px}
}
@media(max-width:380px) {
  .container {padding-inline:18px}
  .brand {font-size:12px;gap:7px;max-width:210px}
  .brand>.icon {width:23px}
  .brand small {font-size:7px}
  .header-actions {gap:5px}
  .hero-inner {min-height:690px;padding-top:36px}
  .hero h1 {font-size:34px;line-height:1.45}
  .hero-eyebrow {font-size:7px;letter-spacing:.02em}
  .hero-copy>p {font-size:11px}
  .hero-buttons {flex-direction:column;align-items:flex-start;gap:10px}
  .hero .button {min-width:205px;justify-content:flex-start}
  .hero .button-end {margin-left:auto}
  .app-visual {height:234px}
  .cheers-wordmark {width:140px;left:20px}
  .cheers-motto {font-size:23px;left:20px;top:115px}
  .cheers-host {right:-7%;width:54%}
  .cheers-orbit {right:-10%}
  .featured-body {padding:20px}
  .featured-body h3 {font-size:27px}
  .feature-tagline {font-size:14px}
  .featured-actions {gap:15px}
  .featured-actions .text-link {font-size:10px}
  .project-content {padding:14px}
  .project-content h3 {font-size:13px}
  .project-content>p {font-size:10px}
  .section-heading h2 {font-size:28px}
  .metric {gap:9px}
  .metrics {gap:0 16px;padding-inline:12px}
  .metric strong {font-size:13px}
}
@media(prefers-reduced-motion:reduce) {
  html {scroll-behavior:auto}
  *,*::before,*::after {animation:none!important;transition:none!important}
  .map-pulse {display:none}
  .featured-project:hover,.project-card:hover,.note-card:hover,.button:hover {transform:none}
}
