/* Jakob / Flow · circular motion, soft glass, one clear action per screen. */
:root{--flow-mint:#d4d4d4;--flow-ink:#f4f4f4;--flow-muted:#a7a7a7;--flow-ease:cubic-bezier(.2,.8,.2,1)}
body{background:radial-gradient(ellipse 540px 480px at 65% -160px,#5e5e5ea6,transparent),#0e0e0e;color:var(--flow-ink)}
.topbar{height:72px;min-height:72px}.logo b{font-size:18px;letter-spacing:-.5px;font-weight:500}.brand-mark.small{background:linear-gradient(145deg,#d0d0d0,#5a5a5a)!important;color:#222222!important;border:1px solid #ebebeb33;border-radius:10px!important;width:32px;height:32px;box-shadow:inset 0 1px #ffffff33,0 5px 20px #00000033}.minimal-menu,.menu-open .minimal-menu{border:1px solid #e1e1e125;border-radius:50%;background:linear-gradient(150deg,#3f3f3f73,#23232366);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);width:46px;height:46px;right:19px;top:13px;padding:11px;color:#dddddd}.minimal-menu span{height:1px;width:22px}.minimal-menu:hover{border-color:#d4d4d466}
body.cockpit-home-page main{max-width:460px;padding:20px 25px 36px;min-height:calc(100dvh - 72px)}.cockpit-home-page .page-head{display:none}.cockpit-home{position:relative;isolation:isolate;animation:flow-page-in .65s var(--flow-ease) both}.cockpit-home::before{content:'';position:absolute;left:50%;top:160px;width:340px;height:340px;transform:translateX(-50%);border-radius:50%;background:#6b6b6b19;filter:blur(65px);z-index:-1;pointer-events:none}.cockpit-greeting{padding-top:13px}.cockpit-kicker{font-size:11px;letter-spacing:.18em;font-weight:550;color:#a5a5a5}.cockpit-greeting h1{font-weight:400;font-size:36px;letter-spacing:-1.3px;margin:13px 0 8px;line-height:1.1;color:#f3f3f3}.cockpit-greeting p{font-size:18px;color:#a9a9a9;margin:0;line-height:1.5}.home-mission{border:0;background:none;position:relative;display:block;width:min(340px,100%);aspect-ratio:1;margin:29px auto 18px;padding:10px;border-radius:50%;color:#f8f8f8;cursor:pointer;isolation:isolate;-webkit-tap-highlight-color:transparent}.home-dial{position:absolute;inset:10px;border-radius:50%;background:radial-gradient(circle at 50% 25%,#43434355,transparent 65%),linear-gradient(155deg,#34343466,#121212cc);box-shadow:inset 0 1px 1px #f4f4f435,inset 0 -1px 0 #d2d2d212,0 20px 45px #00000066;overflow:hidden;border:1px solid #b3b3b328;transition:transform .5s var(--flow-ease),box-shadow .5s}.home-mission::before{content:'';position:absolute;inset:2px;border-radius:50%;background:conic-gradient(from 15deg,#bfbfbf59,transparent 16%,transparent 38%,#8080803d 56%,transparent 70%,#bdbdbd52);mask:radial-gradient(circle,transparent calc(70.7% - 1px),#000000 calc(70.7% - 1px));-webkit-mask:radial-gradient(circle,transparent calc(70.7% - 1px),#000000 calc(70.7% - 1px));pointer-events:none}.home-mission:hover .home-dial{transform:translateY(-3px);box-shadow:inset 0 1px #f4f4f435,0 24px 50px #00000088,0 0 40px #b3b3b31a}.home-mission:active .home-dial{transform:scale(.97)}.home-mission-glow{position:absolute;inset:15%;border-radius:50%;background:#8b8b8b26;filter:blur(35px);animation:flow-breathe 6s ease-in-out infinite;pointer-events:none}.home-room{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;z-index:1}.home-room small{font-size:10px;letter-spacing:.16em;color:#adadad}.home-room strong{font-size:74px;letter-spacing:-4px;font-weight:350;line-height:1;color:#f5f5f5;font-variant-numeric:tabular-nums}.home-room>span{display:flex;gap:10px;align-items:center;font-size:17px;font-weight:400;color:#d6d6d6;margin-top:13px}.home-room>span svg{width:20px;height:20px}.home-dial-route{position:absolute;inset:0;width:100%;height:100%;opacity:.25;transform:rotate(-8deg)}.home-dial-route path{stroke-dasharray:420;stroke-dashoffset:420;animation:flow-draw 1.7s var(--flow-ease) .25s forwards}.cockpit-home-meta{display:flex;flex-direction:column;align-items:center;gap:8px;font-size:15px;color:#9f9f9f;text-align:center;margin:0 0 27px}.cockpit-home-meta>span:first-child{color:#d1d1d1}.cockpit-home-meta i{display:inline-block;width:6px;height:6px;background:#bfbfbf;border-radius:50%;margin-right:8px;box-shadow:0 0 12px #bfbfbf66}.cockpit-shortcuts{display:grid;grid-template-columns:1fr 1fr;gap:13px}.cockpit-shortcuts button{min-height:122px;display:flex;align-items:flex-start;flex-direction:column;justify-content:center;gap:9px;text-align:left;padding:17px;background:linear-gradient(135deg,#83838316,#70707009);border:1px solid #c2c2c224;box-shadow:inset 0 1px #ffffff0c,0 8px 25px #00000022;border-radius:23px;color:#dbdbdb;backdrop-filter:blur(15px);-webkit-backdrop-filter:blur(15px);transition:background .25s,transform .25s}.cockpit-shortcuts button:hover{background:#62626226;transform:translateY(-2px)}.cockpit-shortcuts svg{width:23px;height:23px;color:#acacac}.cockpit-shortcuts span{font-size:18px;letter-spacing:-.3px}.cockpit-shortcuts small{font-size:13px;color:#959595}
/* A full-screen radial menu appears only when requested. */
.menu-open .sidebar{display:block!important;padding:88px 25px 120px!important;background:radial-gradient(ellipse at 50% 34%,#3c3c3c,#141414 75%)!important;overflow-y:auto}.orbit-menu-title{width:min(345px,100%);margin:0 auto 13px;text-align:center}.orbit-menu-title>span{font-size:10px;letter-spacing:.19em;color:#9e9e9e}.orbit-menu-title h2{font-size:30px;font-weight:400;letter-spacing:-1px;color:#e8e8e8;margin:12px 0 7px}.orbit-menu{position:relative;width:min(330px,100%);aspect-ratio:1;margin:12px auto 17px;--orbit-radius:110px;animation:orbit-reveal .7s var(--flow-ease) both}.orbit-menu-ring{position:absolute;inset:16px;border:1px solid #c2c2c222;border-radius:50%;background:radial-gradient(circle,#45454519,transparent 65%);box-shadow:inset 0 0 30px #98989808}.orbit-menu-ring::before{content:'';position:absolute;inset:27px;border-radius:50%;border:1px solid #c2c2c20d}.orbit-menu-center{position:absolute;inset:34%;display:flex;flex-direction:column;align-items:center;justify-content:center;border-radius:50%;gap:8px;color:#d2d2d2}.orbit-menu-center>span{font-size:47px;font-weight:350;letter-spacing:-3px;line-height:1}.orbit-menu-center small{font-size:12px;white-space:nowrap;color:#8b8b8b}.orbit-choice{position:absolute;left:50%;top:50%;width:77px;height:77px;border-radius:50%;border:1px solid #cecece32;background:linear-gradient(145deg,#5d5d5d47,#2222224d);color:#c2c2c2;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;transform:translate(-50%,-50%) rotate(var(--angle)) translateX(var(--orbit-radius)) rotate(calc(-1 * var(--angle)));box-shadow:inset 0 1px #fafafa1a,0 5px 15px #00000033;animation:orbit-choice-in .65s var(--flow-ease) calc(var(--order)*55ms) both;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}.orbit-choice svg{width:25px;height:25px}.orbit-choice span{font-size:15px;font-weight:400;letter-spacing:-.2px}.orbit-choice.active{background:linear-gradient(145deg,#b6b6b6a6,#56565680);color:#f6f6f6;border-color:#d6d6d67d;box-shadow:inset 0 1px #f6f6f64d,0 0 25px #a4a4a42b}.orbit-choice:hover{border-color:#e1e1e17d;color:#f8f8f8}.orbit-choice:focus-visible{outline:2px solid #e4e4e4;outline-offset:5px}.orbit-menu-links{display:grid;grid-template-columns:1fr 1fr;width:min(345px,100%);margin:5px auto 0;gap:4px 20px}.orbit-menu-links button{border:0;background:none;min-height:48px;padding:10px 0;text-align:left;color:#ababab;font-size:17px;font-weight:400;line-height:1.4}.orbit-menu-links button:hover{color:#f1f1f1}.menu-open .topbar .topright{background:linear-gradient(0deg,#161616,#161616f2)!important;padding:12px 0 0!important;border-top-color:#cbcbcb16!important}.menu-open .topright #logoutBtn{font-size:15px}
/* The direction remains the dominant element; rings show actual route progress. */
.navigation-fullscreen{background:radial-gradient(ellipse at 50% 13%,#51515159 0,transparent 56%),radial-gradient(ellipse at 50% 80%,#2f2f2f5e,transparent 65%),#111111}.minimal-navigation{max-width:480px;margin:auto}.minimal-destination{font-size:19px;top:30px;left:27px;letter-spacing:-.3px;color:#cecece}.cockpit-nav-context{position:absolute;top:100px;left:0;width:100%;display:flex;flex-direction:column;align-items:center;gap:10px}.cockpit-nav-context>span{font-size:18px;color:#c9c9c9}.cockpit-nav-context small{font-size:14px;color:#868686}.cockpit-compass{width:min(91vw,360px);aspect-ratio:1;position:absolute;left:50%;top:45%;transform:translate(-50%,-50%);isolation:isolate;border-radius:50%;background:radial-gradient(circle at 50% 25%,#44444440,transparent 70%);box-shadow:0 35px 80px #00000055,inset 0 1px #e8e8e80b}.cockpit-compass::after{content:'';position:absolute;inset:10%;border-radius:50%;background:linear-gradient(125deg,#b9b9b908,transparent 55%,#16161670);box-shadow:inset 0 0 30px #00000022;pointer-events:none;z-index:-1}.cockpit-compass-aura{position:absolute;inset:26%;border-radius:50%;background:#bdbdbd24;filter:blur(45px);animation:flow-breathe 5s ease-in-out infinite;z-index:-1;pointer-events:none}.cockpit-compass-map{position:absolute;inset:14%;overflow:hidden;border-radius:50%;opacity:.10;pointer-events:none;filter:blur(.2px);z-index:-2}.cockpit-compass-map svg{width:100%;height:100%;background:none}.cockpit-dial-scale{position:absolute;inset:0;width:100%;height:100%;filter:drop-shadow(0 0 5px #c7c7c70d)}.cockpit-dial-progress{animation:flow-progress .9s var(--flow-ease) both}.minimal-arrow.cockpit-arrow{left:50%;top:47%;width:64%;height:64%;color:#f2f2f2;padding:0;filter:drop-shadow(0 2px 1px #f9f9f929) drop-shadow(0 8px 20px #96969629);background:none;transform:translate(-50%,-50%);animation:none;box-shadow:none}.cockpit-arrow-mark{transform-origin:60px 60px;animation:flow-bearing .85s var(--flow-ease) both}.cockpit-dial-caption{position:absolute;left:0;bottom:20%;width:100%;text-align:center;font-size:9px;letter-spacing:.2em;color:#8f8f8f;pointer-events:none}.cockpit-instruction{bottom:13%;text-align:center;width:calc(100% - 50px);animation:flow-text-in .55s var(--flow-ease) both}.cockpit-instruction strong{font-size:31px;letter-spacing:-1px;color:#f8f8f8;line-height:1.15}.cockpit-instruction p{font-size:17px;color:#a2a2a2;max-width:310px;margin:15px auto 0;line-height:1.5}.cockpit-simulation{position:absolute;bottom:35px;left:25px;right:25px;text-align:center;font-size:11px;color:#626262;line-height:1.5}
/* Arrival is calm: a large title and tactile, readable checkmarks. */
.minimal-arrival{animation:flow-page-in .65s var(--flow-ease) both;padding:97px 26px 48px}.arrival-head p{display:inline-flex;align-items:center;gap:8px;font-size:15px;letter-spacing:0;color:#ababab}.arrival-head p::before{content:'✓';display:grid;place-items:center;width:24px;height:24px;border-radius:50%;border:1px solid #bbbbbb42;background:#61616126;color:#d2d2d2;font-size:12px}.arrival-head h1{font-size:36px;letter-spacing:-1.3px;font-weight:400;margin:5px 0 39px}.arrival-check{position:relative;border-bottom:1px solid #ababab13;padding:22px 0;min-height:84px;color:#e7e7e7;animation:flow-row-in .5s var(--flow-ease) both}.arrival-check:nth-child(2){animation-delay:65ms}.arrival-check:nth-child(3){animation-delay:130ms}.arrival-check:nth-child(4){animation-delay:195ms}.arrival-check input[type=checkbox],body:not(.map-page) .arrival-check input[type=checkbox]{width:29px;height:29px;flex-basis:29px;border-radius:50%!important;border-color:#9d9d9d80!important;background:linear-gradient(135deg,#73737320,#27272708)!important;transition:background .25s,border-color .25s,box-shadow .25s;box-shadow:inset 0 1px #f4f4f40b}.arrival-check input:checked,body:not(.map-page) .arrival-check input:checked{background:#e0e0e0!important;border-color:#e0e0e0!important;box-shadow:0 0 18px #c2c2c225}.arrival-check span{transition:color .25s}.arrival-link.room-continue{width:100%;display:flex;align-items:center;justify-content:center;border:1px solid #dbdbdb81;background:linear-gradient(115deg,#dedede,#b2b2b2);color:#272727;font-size:21px;border-radius:30px;padding:16px 22px;min-height:58px;margin-top:37px;box-shadow:inset 0 1px #ffffff66,0 12px 30px #4b4b4b25;animation:flow-row-in .5s var(--flow-ease) both}.arrival-link.room-continue:hover{filter:brightness(1.06)}.journal-room{margin-bottom:38px}body:not(.map-page) .journal-room h2{font-size:23px;letter-spacing:-.5px;color:#b3b3b3}.page-head h1{color:#eeeeee}body:not(.map-page):not(.cockpit-home-page) main{padding-top:30px}.simple-journal .arrival-check{border-bottom:1px solid #ababab13}
@keyframes flow-breathe{0%,100%{opacity:.55;transform:scale(.93)}50%{opacity:.9;transform:scale(1.05)}}
@keyframes flow-draw{to{stroke-dashoffset:0}}
@keyframes flow-progress{from{stroke-dashoffset:calc(842 - var(--progress-from))}to{stroke-dashoffset:calc(842 - var(--progress-to))}}
@keyframes flow-bearing{from{transform:rotate(var(--bearing-from));opacity:.5}to{transform:rotate(var(--bearing-to));opacity:1}}
@keyframes flow-page-in{from{opacity:0;transform:translateY(13px)}to{opacity:1;transform:translateY(0)}}
@keyframes flow-row-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
@keyframes flow-text-in{from{opacity:0;translate:0 8px}to{opacity:1;translate:0 0}}
@keyframes orbit-reveal{from{opacity:0;scale:.86;rotate:-8deg}to{opacity:1;scale:1;rotate:0deg}}
@keyframes orbit-choice-in{from{opacity:0;transform:translate(-50%,-50%) rotate(calc(var(--angle) - 35deg)) translateX(calc(var(--orbit-radius)*.8)) rotate(calc(-1 * (var(--angle) - 35deg)))}to{opacity:1;transform:translate(-50%,-50%) rotate(var(--angle)) translateX(var(--orbit-radius)) rotate(calc(-1 * var(--angle)))}}
@media(max-width:360px){body.cockpit-home-page main{padding-inline:20px}.cockpit-greeting h1{font-size:33px}.home-mission{margin-top:23px}.home-room strong{font-size:68px}.home-room small{font-size:9px}.cockpit-shortcuts button{padding:15px}.cockpit-shortcuts span{font-size:16px}.orbit-menu{--orbit-radius:98px}.orbit-choice{width:70px;height:70px}.orbit-choice span{font-size:14px}}
@media(max-height:740px){body.cockpit-home-page main{padding-top:8px}.cockpit-greeting h1{font-size:31px}.cockpit-greeting p{font-size:17px}.home-mission{width:min(280px,100%);margin-top:18px;margin-bottom:14px}.home-room strong{font-size:63px}.cockpit-home-meta{margin-bottom:18px;gap:5px;font-size:14px}.cockpit-shortcuts button{min-height:105px;gap:7px}.cockpit-nav-context{top:85px}.cockpit-compass{width:min(82vw,310px);top:45%}.cockpit-instruction{bottom:12%}.cockpit-instruction strong{font-size:28px}.cockpit-instruction p{font-size:16px}.cockpit-simulation{bottom:23px}.orbit-menu{width:min(290px,100%);--orbit-radius:98px}.orbit-menu-title h2{font-size:26px}.orbit-choice{width:71px;height:71px}.orbit-choice span{font-size:14px}.menu-open .sidebar{padding-top:78px!important}}
@media(max-height:590px){.cockpit-nav-context{top:74px}.cockpit-nav-context small{display:none}.cockpit-compass{width:230px;top:45%}.cockpit-instruction{bottom:10%}.cockpit-instruction strong{font-size:24px}.cockpit-instruction p{font-size:14px;margin-top:8px}.cockpit-simulation{font-size:10px;bottom:13px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.home-dial-route path{stroke-dashoffset:0}.cockpit-arrow-mark{transform:rotate(var(--bearing-to))}.cockpit-dial-progress{stroke-dashoffset:calc(842 - var(--progress-to))}}
body.cockpit-home-page #content{padding:20px 25px 36px!important}
body{background:radial-gradient(ellipse 540px 480px at 65% -160px,#797979a6,transparent),#0e0e0e}
.orbit-choice span{font-size:16px}.home-dial,.cockpit-compass{view-transition-name:flow-dial}
::view-transition-group(flow-dial){animation-duration:.8s;animation-timing-function:cubic-bezier(.2,.8,.2,1)}
::view-transition-old(flow-dial),::view-transition-new(flow-dial){mix-blend-mode:normal;height:100%}
::view-transition-old(root){animation-duration:.2s}::view-transition-new(root){animation-duration:.35s}
.flow-shift-controls{display:flex;gap:24px;align-items:center;justify-content:space-between;margin:0 0 35px}.flow-shift-controls>.primary{font-size:20px!important}.flow-shift-controls .journal-options{margin:0}
@media(max-height:740px){body.cockpit-home-page #content{padding-top:8px!important}}
@media(prefers-reduced-motion:reduce){.home-dial,.cockpit-compass{view-transition-name:none}::view-transition-group(*){animation:none!important}}
.app-layout{min-height:calc(100dvh - 72px)}.minimal-map{height:calc(100dvh - 72px)}
