:root{
  --paper:#f3f2ec;
  --ink:#494946;
  --soft:#858580;
  --line:rgba(73,73,70,.18);
  --line2:rgba(73,73,70,.38);
  --red:#a7191f;
  --red-dark:#761116;
  --panel:rgba(37,38,38,.92);
  --ease:cubic-bezier(.2,.8,.2,1);
}
*{box-sizing:border-box}
html{background:var(--paper);scroll-behavior:smooth}
body{
  margin:0;min-height:100vh;overflow-x:hidden;color:var(--ink);
  font-family:"Arial Narrow","Segoe UI",Arial,sans-serif;
  background:linear-gradient(90deg,#faf9f5 0%,#eceae4 49%,#faf9f6 100%);
}
a,button{font:inherit;color:inherit}
button{cursor:pointer}
::selection{background:var(--red);color:#fff}
.white-room{position:fixed;inset:0;z-index:0;overflow:hidden;pointer-events:none;color:rgba(75,75,72,.22)}
.white-room::before{
  content:"";position:absolute;inset:0;
  background:
    repeating-linear-gradient(to bottom,rgba(70,70,68,.025) 0 1px,transparent 1px 5px),
    linear-gradient(90deg,transparent 0 14%,rgba(255,255,255,.9) 14.2% 14.8%,transparent 15% 42%,rgba(255,255,255,.88) 42.2% 42.8%,transparent 43% 72%,rgba(255,255,255,.9) 72.2% 72.8%,transparent 73%);
}
.light{position:absolute;top:-10vh;width:2px;height:120vh;background:white;box-shadow:0 0 18px 4px rgba(255,255,255,.8)}
.l1{left:17%}.l2{left:43%}.l3{left:71%}.l4{left:89%}
.floor-grid{
  position:absolute;width:140vw;height:55vh;left:-20vw;bottom:-21vh;
  background-image:linear-gradient(rgba(70,70,68,.1) 1px,transparent 1px),linear-gradient(90deg,rgba(70,70,68,.1) 1px,transparent 1px);
  background-size:52px 52px;transform:perspective(600px) rotateX(68deg);transform-origin:center bottom;
  opacity:.4;mask-image:linear-gradient(to top,#000 20%,transparent 92%);
}
.city-memory{position:absolute;left:0;right:0;bottom:0;width:100%;opacity:.16;mask-image:linear-gradient(to top,#000 0 50%,transparent 98%)}

.boot{
  position:fixed;inset:0;z-index:999;display:grid;place-content:center;padding:24px;background:#f2f0ea;
  animation:bootOut .5s var(--ease) 1.18s forwards
}
.boot__diamond{width:48px;height:48px;border:1px solid var(--ink);transform:rotate(45deg);margin:0 0 22px 5px}
.boot__diamond span{display:block;width:18px;height:18px;margin:14px;background:var(--red);box-shadow:-6px 6px 0 rgba(167,25,31,.2)}
.boot p,.boot small,.subject,.session,.identity-intro>div>p:first-child,.section-head,.memory-topline,.memory-code,.memory-type,
.project-row span,.project-row small,.project-detail__head,.visual-title,.project-kind,.bottom-hud,.metric,.telemetry-status,.flow-qualifiers,
.project-tags,.groundline-bar{
  font-family:Consolas,"Courier New",monospace;letter-spacing:.08em
}
.boot p,.boot small{margin:0;font-size:9px;color:var(--soft)}
.boot h1{margin:10px 0 22px;font-size:clamp(38px,7vw,72px);line-height:.88;font-weight:300;letter-spacing:-.055em}
.boot__bar{height:4px;border:1px solid var(--ink);margin-bottom:9px}
.boot__bar span{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--red) 0 10px,var(--ink) 10px);animation:fill .8s var(--ease) .12s forwards}
@keyframes fill{to{width:100%}}
@keyframes bootOut{to{opacity:0;visibility:hidden;filter:brightness(1.25)}}

.interface{position:relative;z-index:5;width:min(1380px,calc(100% - 48px));margin:0 auto;padding:22px 0 82px}
.top-hud{display:flex;justify-content:space-between;gap:20px;padding:10px 12px 14px;border-top:1px solid var(--line2);border-bottom:1px solid var(--line)}
.subject,.session{font-size:9px;color:var(--soft)}
.subject span,.session span{display:block;margin-bottom:4px}
.subject strong,.session strong{font-size:11px;font-weight:500;color:var(--ink)}
.session{text-align:right}.session strong{color:var(--red)}

.identity-intro{
  min-height:410px;display:grid;grid-template-columns:1.2fr .8fr;align-items:center;gap:50px;
  padding:48px 18px;border-bottom:1px solid var(--line2)
}
.identity-intro>div>p:first-child{margin:0 0 12px;font-size:9px;color:var(--soft)}
.identity-intro h1{margin:0;font-size:clamp(44px,6vw,82px);line-height:.9;font-weight:400;letter-spacing:-.06em}
.identity-intro h1 em{font-style:normal;color:var(--red)}
.intro-copy{max-width:650px;margin:24px 0 0;color:#696965;font-size:15px;line-height:1.65}
.identity-sigil{position:relative;width:min(330px,28vw);aspect-ratio:1;justify-self:center;display:grid;place-items:center}
.identity-sigil .diamond{position:absolute;border:1px solid var(--line2);transform:rotate(45deg)}
.identity-sigil .d1{inset:12%;animation:spin 18s linear infinite}
.identity-sigil .d2{inset:32%;border-color:rgba(167,25,31,.55);animation:spin 11s linear infinite reverse}
.identity-sigil .circle{position:absolute;inset:22%;border:1px dashed var(--line2);border-radius:50%}
.identity-sigil strong{font:700 25px/1 Consolas,monospace;letter-spacing:.14em}
@keyframes spin{to{transform:rotate(405deg)}}

.dna-section,.projects{padding:42px 14px 50px;border-bottom:1px solid var(--line2)}
.section-head{display:flex;align-items:flex-end;justify-content:space-between;gap:18px;margin-bottom:18px}
.section-head>div{display:flex;align-items:baseline;gap:13px}
.section-head span,.section-head p{font-size:8px;color:var(--soft);margin:0}
.section-head h2{margin:0;font-family:"Segoe UI",Arial,sans-serif;font-size:17px;letter-spacing:.12em;font-weight:500}

.dna-layout{position:relative;min-height:650px}
.dna-rail{position:absolute;left:8px;top:18px;width:360px;height:600px}
.dna-strand{position:absolute;left:42px;top:5px;width:220px;height:580px;transform:skewY(-5deg)}
.dna-strand::before,.dna-strand::after{content:"";position:absolute;top:-6px;bottom:-6px;width:1px;background:linear-gradient(to bottom,transparent,rgba(73,73,70,.28),transparent)}
.dna-strand::before{left:28px;transform:skewX(-17deg)}.dna-strand::after{right:28px;transform:skewX(17deg)}
.dna-strand i{position:absolute;left:22px;width:172px;height:28px;border:1px solid rgba(73,73,70,.14);transform:rotate(45deg) skew(-8deg,-8deg);background:rgba(255,255,255,.22)}
.dna-strand i:nth-child(1){top:0}.dna-strand i:nth-child(2){top:36px}.dna-strand i:nth-child(3){top:72px}.dna-strand i:nth-child(4){top:108px}
.dna-strand i:nth-child(5){top:144px}.dna-strand i:nth-child(6){top:180px}.dna-strand i:nth-child(7){top:216px}.dna-strand i:nth-child(8){top:252px}
.dna-strand i:nth-child(9){top:288px}.dna-strand i:nth-child(10){top:324px}.dna-strand i:nth-child(11){top:360px}.dna-strand i:nth-child(12){top:396px}
.dna-strand i:nth-child(13){top:432px}.dna-strand i:nth-child(14){top:468px}.dna-strand i:nth-child(15){top:504px}.dna-strand i:nth-child(16){top:540px}

.dna-menu{position:absolute;left:65px;top:20px;width:520px;height:600px}
.dna-link{position:absolute;display:flex;align-items:center;height:48px;text-decoration:none;outline:none;color:#585854;transition:transform .26s var(--ease),color .2s}
.dna-link .node{position:relative;z-index:2;width:31px;height:31px;flex:0 0 31px;background:#686863;border:1px solid rgba(255,255,255,.9);transform:rotate(45deg);box-shadow:0 0 0 1px rgba(73,73,70,.13);transition:.25s var(--ease)}
.dna-link .node::before{content:"";position:absolute;inset:5px;border:1px solid rgba(255,255,255,.38)}
.dna-link .label{position:relative;z-index:1;min-width:175px;margin-left:-4px;padding:6px 15px 7px 18px;background:rgba(249,248,244,.82);border-top:1px solid rgba(73,73,70,.14);border-bottom:1px solid rgba(73,73,70,.12);font-size:19px;line-height:1;transition:.25s var(--ease)}
.dna-link.is-active,.dna-link:hover,.dna-link:focus-visible{color:#fff;transform:translateX(7px)}
.dna-link.is-active .node,.dna-link:hover .node,.dna-link:focus-visible .node{background:var(--red);transform:rotate(45deg) scale(1.08);box-shadow:-6px 6px 0 rgba(118,17,22,.62),-12px 12px 0 rgba(118,17,22,.2)}
.dna-link.is-active .label,.dna-link:hover .label,.dna-link:focus-visible .label{background:linear-gradient(90deg,var(--red-dark),var(--red));min-width:215px}
.pos-1{left:135px;top:8px}.pos-2{left:48px;top:91px}.pos-3{left:175px;top:174px}.pos-4{left:70px;top:257px}
.pos-5{left:154px;top:336px}.pos-6{left:215px;top:421px}.pos-7{left:48px;top:506px}

.memory-card{position:absolute;right:20px;top:48px;width:min(48%,610px);min-width:450px}
.memory-card__visual{position:relative;height:192px;overflow:hidden;border:1px solid var(--line2);background:linear-gradient(135deg,rgba(255,255,255,.78),rgba(194,193,187,.28));box-shadow:0 12px 30px rgba(43,43,40,.07)}
.memory-visual{position:absolute;inset:0;display:none}
.memory-visual.is-visible{display:block}
.reconstruction-grid{position:absolute;inset:0;background-image:linear-gradient(rgba(73,73,70,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(73,73,70,.07) 1px,transparent 1px);background-size:30px 30px}
.memory-mark{position:absolute;left:50%;top:50%;width:84px;height:84px;transform:translate(-50%,-50%) rotate(45deg);border:2px solid rgba(255,255,255,.95);box-shadow:0 0 18px rgba(255,255,255,.75)}
.memory-mark span{position:absolute;inset:27px;background:rgba(167,25,31,.65)}
.memory-card__visual small{position:absolute;left:12px;bottom:10px;font:8px/1 Consolas,monospace;letter-spacing:.08em;color:#73736f}

/* dynamic memory visuals */
.code-columns{position:absolute;inset:24px 26px 30px;display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.code-columns span{background:linear-gradient(to bottom,rgba(73,73,70,.18) 0 12%,transparent 12% 18%,rgba(73,73,70,.13) 18% 31%,transparent 31% 37%,rgba(73,73,70,.1) 37% 46%,transparent 46% 52%,rgba(73,73,70,.16) 52% 61%,transparent 61% 100%)}
.git-graph{position:absolute;inset:36px 30px 34px}
.git-graph i{position:absolute;width:16px;height:16px;border:2px solid var(--red);background:#f1efe8;transform:rotate(45deg)}
.git-graph .n1{left:16%;top:32%}.git-graph .n2{left:42%;top:51%}.git-graph .n3{left:67%;top:28%}.git-graph .n4{left:80%;top:67%}
.git-graph b{position:absolute;height:1px;background:rgba(167,25,31,.48);transform-origin:left center}
.git-graph .l1{left:20%;top:38%;width:25%;transform:rotate(18deg)}
.git-graph .l2{left:46%;top:56%;width:24%;transform:rotate(-26deg)}
.git-graph .l3{left:46%;top:57%;width:37%;transform:rotate(22deg)}

.ticket-stack .card{position:absolute;display:block;border:1px solid var(--line2);background:rgba(255,255,255,.45)}
.ticket-stack .c1{width:118px;height:138px;left:31%;top:24px;transform:rotate(-9deg)}
.ticket-stack .c2{width:118px;height:138px;left:42%;top:38px;transform:rotate(4deg)}
.ticket-stack .c3{width:118px;height:138px;left:53%;top:24px;transform:rotate(11deg);border-color:rgba(167,25,31,.55)}

.profile-grid{position:absolute;inset:28px 28px 28px}
.profile-grid .avatar{position:absolute;left:14%;top:50%;width:84px;height:84px;border:1px solid var(--line2);border-radius:50%;transform:translateY(-50%)}
.profile-grid .avatar::before{content:"";position:absolute;left:50%;top:26%;width:20px;height:20px;border-radius:50%;background:rgba(73,73,70,.18);transform:translateX(-50%)}
.profile-grid .avatar::after{content:"";position:absolute;left:50%;bottom:16px;width:48px;height:26px;border-radius:25px 25px 10px 10px;background:rgba(73,73,70,.14);transform:translateX(-50%)}
.profile-grid .line{position:absolute;left:42%;right:8%;height:12px;border:1px solid rgba(73,73,70,.14);background:rgba(255,255,255,.32)}
.profile-grid .line1{top:28px}.profile-grid .line2{top:56px}.profile-grid .line3{top:84px}.profile-grid .line4{top:112px;width:58%}

.media-frame{position:absolute;left:50%;top:50%;width:250px;height:124px;border:1px solid var(--line2);background:rgba(255,255,255,.28);transform:translate(-50%,-50%)}
.media-frame .play{position:absolute;left:50%;top:50%;width:0;height:0;border-top:18px solid transparent;border-bottom:18px solid transparent;border-left:28px solid var(--red);transform:translate(-35%,-50%)}
.media-frame .timeline{position:absolute;left:16px;right:16px;bottom:12px;height:4px;background:rgba(73,73,70,.12)}
.media-frame .timeline::after{content:"";position:absolute;left:0;top:0;bottom:0;width:38%;background:var(--red)}

.doc-sheet{position:absolute;left:50%;top:50%;width:145px;height:168px;border:1px solid var(--line2);background:rgba(255,255,255,.46);transform:translate(-50%,-50%)}
.doc-sheet::before{content:"";position:absolute;left:18px;right:18px;top:18px;height:18px;border:1px solid rgba(167,25,31,.38);background:rgba(167,25,31,.06)}
.doc-line{position:absolute;left:18px;right:18px;height:8px;background:rgba(73,73,70,.12)}
.dl1{top:52px}.dl2{top:72px}.dl3{top:92px}.dl4{top:112px}.dl5{top:132px;right:40px}

.contact-map{position:absolute;inset:20px 24px}
.contact-map .hub,.contact-map .p{position:absolute;display:block;width:28px;height:28px;border:2px solid var(--red);background:#f1efe8;transform:rotate(45deg)}
.contact-map .hub{left:50%;top:50%;width:40px;height:40px;transform:translate(-50%,-50%) rotate(45deg);background:rgba(167,25,31,.5)}
.contact-map .p1{left:22%;top:28%}.contact-map .p2{right:18%;top:22%}.contact-map .p3{left:31%;bottom:14%}
.contact-map .c{position:absolute;height:1px;background:rgba(167,25,31,.48);transform-origin:left center}
.contact-map .c1{left:28%;top:37%;width:23%;transform:rotate(21deg)}
.contact-map .c2{left:54%;top:47%;width:22%;transform:rotate(-32deg)}
.contact-map .c3{left:38%;top:60%;width:15%;transform:rotate(53deg)}

.memory-card__content{position:relative;width:92%;margin:10px 0 0 auto;padding:16px 20px 19px;background:var(--panel);color:#f5f4ef;border-left:5px solid var(--red)}
.memory-topline{display:flex;justify-content:space-between;gap:14px;font-size:8px;color:#b8b7b2}
.memory-code{margin:16px 0 5px;font-size:8px;color:#aaa9a5}
.memory-title{display:inline-block;margin:0;padding:3px 8px 4px;background:var(--red);font-size:28px;line-height:1;font-weight:400;letter-spacing:-.03em}
.memory-type{margin:11px 0 5px;font-size:8px;color:#c9c8c3}
.memory-description{min-height:45px;margin:0;color:#deddd8;font-size:13px;line-height:1.5}
.memory-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}
.memory-actions button{border:0;padding:8px 10px;font:8px/1 Consolas,monospace;letter-spacing:.06em}
.memory-actions .primary{background:var(--red);color:#fff}.memory-actions .secondary{background:rgba(255,255,255,.1);color:#eee}

.project-layout{display:grid;grid-template-columns:370px 1fr;gap:16px}
.project-index{border-top:1px solid var(--line2)}
.project-row{width:100%;min-height:66px;display:grid;grid-template-columns:36px 1fr 78px;align-items:center;border:0;border-bottom:1px solid var(--line);background:transparent;text-align:left;color:#575753;transition:.24s var(--ease)}
.project-row span,.project-row small{font-size:8px;color:var(--soft)}.project-row strong{font-size:18px;font-weight:400}.project-row small{text-align:right;padding-right:9px}
.project-row:hover,.project-row.is-active{padding-left:8px;background:linear-gradient(90deg,var(--red) 0 5px,rgba(44,44,42,.9) 5px);color:#f4f3ef}
.project-row:hover span,.project-row:hover small,.project-row.is-active span,.project-row.is-active small{color:#ceccc7}

.project-detail{display:grid;grid-template-rows:auto 1fr;min-height:338px;border:1px solid var(--line2);background:rgba(255,255,255,.32)}
.project-detail__head{display:flex;justify-content:space-between;padding:10px 12px;border-bottom:1px solid var(--line);font-size:8px;color:var(--soft)}
.project-detail__body{display:grid;grid-template-columns:minmax(420px,1.08fr) minmax(260px,.78fr);min-height:290px}
.project-visuals{position:relative;min-height:290px;border-right:1px solid var(--line);overflow:hidden}
.project-visual{position:absolute;inset:0;display:none;padding:16px 18px 18px;background:radial-gradient(circle at center,rgba(255,255,255,.76),transparent 62%),repeating-linear-gradient(0deg,rgba(73,73,70,.045) 0 1px,transparent 1px 26px),repeating-linear-gradient(90deg,rgba(73,73,70,.045) 0 1px,transparent 1px 26px)}
.project-visual.is-visible{display:block}
.visual-title{font-size:8px;color:var(--soft)}
.project-visual>small{position:absolute;left:18px;bottom:14px;font:8px/1.3 Consolas,monospace;letter-spacing:.06em;color:var(--soft)}
.project-copy{padding:24px 24px 20px}
.project-kind{margin:0 0 10px;font-size:8px;color:var(--red)}
.project-title{margin:0 0 14px;font-size:46px;line-height:.95;font-weight:400;letter-spacing:-.05em;word-break:break-word}
.project-description{margin:0;color:#666661;font-size:14px;line-height:1.62;max-width:270px}
.project-tags{display:flex;flex-wrap:wrap;gap:7px;margin-top:18px}
.project-tags span{padding:5px 7px;border:1px solid var(--line2);font-size:7px;color:var(--soft);background:rgba(255,255,255,.38)}

/* Groundline clean */
.groundline-shell{padding-top:16px}
.groundline-bar{display:flex;gap:18px;flex-wrap:wrap;padding-bottom:10px;border-bottom:1px solid var(--line);font-size:7px;color:var(--soft)}
.graph.clean{position:relative;height:195px;margin-top:14px}
.g-node{position:absolute;min-width:92px;padding:8px 10px;border:1px solid var(--line2);background:#f1efe9;text-align:center;font:8px/1.2 Consolas,monospace;letter-spacing:.05em}
.g-node.claim{left:42%;top:62px;background:var(--red);color:#fff;border-color:var(--red)}
.g-node.e1{left:6%;top:32px}.g-node.e2{left:8%;bottom:38px}.g-node.a1{right:8%;top:30px}
.g-node.approval{right:6%;bottom:34px;border-color:var(--red)}
.g-node.revision{left:40%;bottom:14px;border-color:rgba(167,25,31,.45);background:rgba(255,255,255,.55)}
.g-line{position:absolute;height:1px;background:rgba(167,25,31,.48);transform-origin:left center}
.graph .l1{left:22%;top:50px;width:26%;transform:rotate(16deg)}
.graph .l2{left:22%;bottom:58px;width:28%;transform:rotate(-16deg)}
.graph .l3{left:57%;top:89px;width:24%;transform:rotate(-19deg)}
.graph .l4{left:57%;top:91px;width:25%;transform:rotate(18deg)}
.graph .l5{left:48%;top:98px;width:4%;transform:rotate(90deg)}

/* Scoby */
.scoby-panel{display:grid;grid-template-columns:215px 1fr;gap:18px;padding-top:16px}
.telemetry-left{padding-right:8px;border-right:1px solid var(--line)}
.metric{display:grid;grid-template-columns:60px 72px 1fr;align-items:center;gap:10px;margin:15px 0;font-size:8px}