:root{--blue:#2F6BFF;--page-width:1248px;--gutter:32px;--ease:cubic-bezier(.22,1,.36,1)}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:100px}body{overflow-x:clip}button,input{font:inherit}button,a{-webkit-tap-highlight-color:transparent}button{color:inherit}a{text-decoration:none}button{cursor:pointer}button:disabled{cursor:wait}button:focus-visible,a:focus-visible{outline:3px solid var(--blue);outline-offset:5px}img{max-width:100%;display:block}h1,h2,h3{font-stretch:34%;font-weight:700;letter-spacing:-.005em;margin:0}p{margin:0}h2{font-size:64px;line-height:1.02}.section-wrap{width:min(var(--page-width),calc(100% - var(--gutter)*2));margin-inline:auto}.mono,.eyebrow{font-size:12px;font-weight:650;letter-spacing:.11em;line-height:1.5}.eyebrow{display:flex;align-items:center;gap:9px;letter-spacing:.09em}.green-square{display:inline-block;width:8px;height:8px;background:var(--accent);flex:none}.blue-text{color:var(--blue)}.button{display:inline-flex;align-items:center;justify-content:center;gap:24px;min-height:52px;padding:0 23px;border-radius:12px;border:1px solid transparent;font-size:15px;font-weight:650;transition:transform .25s var(--ease),background .2s,box-shadow .2s;white-space:nowrap}.button:hover{transform:translateY(-3px);box-shadow:0 6px 0 #17171712;color:inherit}.button span,.text-button span{font-size:23px;font-weight:400}.button.primary{background:var(--accent);color:var(--koko-ink)}.button.primary:hover{background:var(--accent-pressed)}.button.dark{background:var(--koko-ink);color:var(--koko-offwhite)}.button.small{min-height:42px;font-size:13px;padding-inline:18px;gap:22px}.button.outline{border-color:var(--border-control);background:var(--surface)}.text-button{border:0;background:none;padding:0;display:inline-flex;align-items:center;gap:16px;font-size:14px;font-weight:650;line-height:1.5}.text-button:hover{color:var(--blue)}.skip-link{position:fixed;top:-100px;z-index:100;background:var(--accent);padding:15px}.skip-link:focus{top:0}
.site-header{position:sticky;top:0;z-index:20;background:#f7f7f2ed;backdrop-filter:blur(16px);border-bottom:1px solid var(--border-card)}.nav-wrap{width:min(var(--page-width),calc(100% - var(--gutter)*2));height:78px;display:flex;align-items:center;justify-content:space-between;margin:auto;gap:35px}.brand{display:flex;align-items:center;gap:13px;flex:none}.brand-mark{width:26px;height:28px;object-fit:contain}.brand-word{width:76px;height:25px;object-fit:contain}.nav-wrap nav{display:flex;gap:32px;align-items:center;margin-left:60px}.nav-wrap nav a,.login{font-size:13px;font-weight:550}.nav-wrap nav a:hover,.login:hover{color:var(--blue)}.nav-spark{display:inline-block;color:var(--blue);font-size:18px;margin-left:4px}.nav-actions{display:flex;gap:25px;align-items:center}.login span{margin-left:7px}
.hero{position:relative;margin-top:24px;display:grid;grid-template-columns:1fr 1.08fr;align-items:center;min-height:648px;gap:14px;padding:48px 36px 42px 48px;background:#fff;border:1px solid var(--border-card);border-radius:16px;overflow:hidden}.hero-copy{position:relative;z-index:2}.hero-copy .eyebrow{margin-bottom:24px}.hero h1{font-size:clamp(67px,6.7vw,98px);line-height:.97;letter-spacing:-.012em;white-space:nowrap}.underlined{position:relative;z-index:0}.underlined svg{position:absolute;left:-2%;bottom:-9px;width:104%;height:26px;z-index:-1;overflow:visible}.underlined path{fill:none;stroke:var(--blue);stroke-width:10;stroke-linecap:round}.hero-description{font-size:18px;line-height:1.6;color:var(--text-secondary);margin-top:29px}.hero-description strong{font-weight:600;color:var(--koko-ink)}.hero-actions{display:flex;gap:24px;margin-top:27px;align-items:center}.hero-note{font-size:12px;color:var(--text-secondary);display:flex;align-items:center;gap:7px;margin-top:13px}.tiny-clock{width:11px;height:11px;border:1px solid #777;border-radius:50%;position:relative}.tiny-clock:after{content:"";position:absolute;left:4px;top:2px;width:3px;height:4px;border-left:1px solid #777;border-bottom:1px solid #777}.hero-aside{display:flex;gap:12px;margin-top:39px;align-items:center;font-size:12px;line-height:1.8;color:var(--text-secondary)}.hero-aside a{color:var(--koko-ink);font-weight:550}.hero-aside a:hover{color:var(--blue)}.aside-arrow{font-size:32px;font-weight:300;color:var(--blue);transform:rotate(-12deg)}
.playground{position:relative;line-height:1.35;min-width:0;padding:3px 1px 0 15px}.playground:before{content:"";position:absolute;inset:4% -8% 5% -18%;background:radial-gradient(ellipse at 65% 55%,#d9ffb080,transparent 65%),radial-gradient(ellipse at 25% 70%,#cde4ff80,transparent 70%);filter:blur(20px);pointer-events:none}.playground-top{position:relative;display:flex;align-items:center;justify-content:space-between;margin:0 0 17px;gap:10px}.playground-top .mono{font-size:12px;color:var(--text-secondary)}.shuffle{display:flex;align-items:center;gap:7px;border:0;background:none;font-size:12px;font-weight:600;padding:8px 0}.shuffle svg{width:14px;height:14px;transition:transform .4s}.shuffle:hover svg{transform:rotate(180deg)}.idea-bubble{position:relative;background:var(--koko-ink);color:#fff;padding:17px 15px;border-radius:13px 13px 13px 3px;display:flex;gap:11px;align-items:center;box-shadow:0 10px 25px #17171716;transform:rotate(-2deg);font-size:13px;width:92%;z-index:4;margin:0 0 5px 2px}.bubble-symbol{font-size:27px;color:var(--accent)}.bubble-arrow{color:#ababab;margin-left:auto;font-size:20px}.trip-scene{position:relative;padding-top:13px;padding-bottom:18px;perspective:1000px}.map-paper{position:relative;border:1px solid #d8d8cf;border-radius:13px;background:#fff;transform:rotate(2deg);box-shadow:0 5px 0 -1px #f4f4ee,0 5px 0 #d8d8cf,0 10px 0 -1px #fff,0 10px 0 #d8d8cf,0 25px 30px -18px #17171740;transition:transform .6s var(--ease)}.trip-scene:hover .map-paper{transform:rotate(.5deg) translateY(-2px)}.map-heading{display:flex;justify-content:space-between;align-items:center;padding:16px 20px 13px;gap:6px}.map-heading .mono{font-size:12px;color:var(--text-secondary)}.map-heading h2{font-size:25px;line-height:1.1;margin-top:4px}.map-weather{font-size:12px;letter-spacing:.04em;border:1px solid var(--border-card);padding:5px 7px;border-radius:4px;white-space:nowrap}.map-canvas{height:280px;position:relative;overflow:visible;border-top:1px solid var(--border-card);border-bottom:1px solid var(--border-card)}.city-map{width:100%;height:100%;display:block}.route-line,.route-shadow{fill:none;stroke-linecap:round;stroke-width:5}.route-shadow{stroke:#fff;stroke-width:9}.route-line{stroke:var(--blue);stroke-dasharray:7 9;animation:route-flow 20s linear infinite}.map-pin{position:absolute;width:31px;height:31px;border:3px solid #fff;border-radius:50% 50% 50% 5px;transform:translate(-50%,-75%) rotate(-45deg);background:var(--koko-ink);color:#fff;box-shadow:0 3px 5px #17171725;display:grid;place-items:center;z-index:4;padding:0;transition:scale .2s,background .2s}.map-pin span{transform:rotate(45deg);font-size:12px;font-weight:700}.map-pin:hover,.map-pin[aria-pressed=true]{background:var(--accent);color:var(--koko-ink);scale:1.15}.pin-0{left:16.7%;top:65%}.pin-1{left:36%;top:39%}.pin-2{left:60.5%;top:27%}.pin-3{left:82.3%;top:52%}.map-label{position:absolute;font-size:12px;font-weight:500;letter-spacing:.12em;color:#747c6c;pointer-events:none}.label-one{left:7%;top:36%;transform:rotate(-15deg)}.label-two{right:6%;top:65%;transform:rotate(46deg);color:#8298b1}.photo-card{position:absolute;top:46%;left:33%;width:185px;background:#fff;border:0;border-radius:3px;padding:7px 7px 9px;box-shadow:0 8px 22px #17171729;transform:rotate(-8deg);z-index:5;text-align:left;transition:transform .3s var(--ease)}.photo-card:before{content:"";position:absolute;top:-8px;left:36%;height:22px;width:56px;background:#f1edceab;transform:rotate(8deg);z-index:1}.photo-card:hover{transform:rotate(-3deg) translateY(-6px)}.photo-card img{width:100%;height:103px;object-fit:cover}.photo-caption{font-size:12px;font-weight:600;display:flex;justify-content:space-between;gap:4px;padding-top:8px;line-height:1.3}.photo-meta{font-size:12px;letter-spacing:.08em;margin-top:5px;color:var(--text-secondary)}.map-sticker{position:absolute;right:-16px;top:12px;width:88px;height:88px;border-radius:50%;background:var(--accent);color:var(--koko-ink);border:3px double var(--koko-ink);transform:rotate(14deg);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;box-shadow:3px 4px 0 #171717}.map-sticker span{font-size:12px;letter-spacing:.1em}.map-sticker b{font-stretch:34%;font-size:22px;line-height:.85;text-align:center}.trip-ticket{display:flex;align-items:center;gap:11px;padding:21px 17px 15px;background:#fff;border-radius:0 0 13px 13px}.ticket-icon{width:31px;height:31px;display:grid;place-items:center;border:1px solid var(--border-card);border-radius:8px;font-size:22px;background:var(--bg)}.trip-ticket strong{font-size:12px;display:block}.trip-ticket div>span{display:block;font-size:12px;color:var(--text-secondary);margin-top:3px}.ticket-check{margin-left:auto;display:grid;place-items:center;background:var(--accent);width:24px;height:24px;border-radius:50%;font-size:12px}.scene-note{position:absolute;right:7px;bottom:-8px;color:var(--blue);font-size:12px;transform:rotate(-4deg)}.destination-bar{display:flex;align-items:center;justify-content:space-between;margin-top:24px;gap:12px;position:relative}.destination-switch{display:flex;gap:4px;padding:4px;border-radius:999px;background:#efefe8b0;border:1px solid var(--border-card)}.destination-switch button{border:0;padding:7px 12px;border-radius:999px;font-size:12px;background:transparent;transition:background .2s,box-shadow .2s}.destination-switch button.active{background:#fff;box-shadow:0 1px 5px #17171717;font-weight:650}.demo-label{font-size:12px;color:var(--text-secondary);letter-spacing:.09em}.map-paper.changing{animation:paper-pop .5s var(--ease)}
.journey-strip{display:flex;align-items:center;justify-content:center;gap:32px;padding:29px 48px;border-bottom:1px solid var(--border-control)}.journey-strip>span:not(.strip-line){font-size:12px;white-space:nowrap;display:flex;gap:13px;align-items:center}.journey-strip b{font-size:12px;color:var(--text-secondary);font-weight:450}.strip-line{height:1px;background:var(--border-control);flex:1;max-width:132px}.strip-star{font-size:23px;color:var(--blue);margin-left:5px}
.how{display:grid;grid-template-columns:1fr 1.1fr;align-items:center;gap:70px;padding:104px 48px 88px}.how h2{margin:20px 0 23px}.how-text>p:not(.eyebrow){font-size:15px;line-height:1.7;color:var(--text-secondary);max-width:390px;margin-top:14px}.how-text .text-button{margin-top:25px}.how-text>small{display:block;color:var(--text-secondary);font-size:12px;margin-top:11px}.transformation{height:425px;position:relative}.mini-conversation{position:absolute;left:-16px;top:55px;width:280px;background:#fff;border:1px solid var(--border-control);border-radius:13px;padding:19px;transform:rotate(-5deg);box-shadow:0 12px 26px #1717170c;z-index:2;transition:transform .7s var(--ease),opacity .5s}.mini-chat-header{display:flex;align-items:center;justify-content:space-between;font-size:12px;letter-spacing:.1em;color:var(--text-secondary)}.user-message{font-size:12px;line-height:1.55;padding:13px;background:var(--surface-muted);border-radius:12px 12px 2px 12px;margin:20px 0 18px 22px}.ai-message{font-size:12px;line-height:1.7;position:relative;padding-left:25px}.ai-message>span{position:absolute;left:0;font-size:22px}.send-koko{display:flex;justify-content:space-between;width:100%;margin-top:23px;border:1px solid #d8d8cf;border-radius:8px;padding:11px;background:#fff;font-size:12px;font-weight:600;transition:background .2s}.send-koko:hover{background:var(--accent)}.send-koko span{font-size:15px}.transfer-arrow{position:absolute;top:17px;left:42%;font-size:70px;color:var(--blue);transform:rotate(16deg);z-index:3}.real-trip{position:absolute;right:4px;top:2px;width:202px;background:var(--koko-ink);padding:6px 6px 25px;border-radius:24px;box-shadow:0 22px 40px #17171716;transform:rotate(6deg);transition:transform .7s var(--ease)}.real-trip>img{width:100%;height:359px;object-fit:cover;object-position:top;border-radius:19px}.real-trip-badge{position:absolute;top:25px;right:-20px;display:flex;gap:6px;align-items:center;font-size:12px;letter-spacing:.08em;background:var(--accent);padding:9px 11px;box-shadow:0 4px 13px #17171720;border-radius:5px;transform:rotate(-6deg)}.real-trip-badge>span{width:6px;height:6px;background:#171717;border-radius:50%}.real-trip-caption{font-size:12px;color:#fff;position:absolute;bottom:7px;left:0;width:100%;text-align:center}.demo-caption{position:absolute;bottom:-4px;left:10px;font-size:12px;color:var(--text-secondary)}.transformation.is-sent .mini-conversation{transform:rotate(-2deg) translate(-12px,-7px)}.transformation.is-sent .real-trip{transform:rotate(0) translateY(-12px) scale(1.06)}.transformation.is-sent .real-trip-badge{animation:stamp .5s var(--ease)}
.trips{padding:58px 0 88px;border-top:1px solid var(--border-control)}.section-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:25px;padding:0 5px 32px}.section-heading h2{margin-top:18px}.section-intro{padding-bottom:3px}.section-intro p{font-size:14px;line-height:1.7;color:var(--text-secondary)}.section-intro a{margin-top:17px}.trip-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}.escape-card{overflow:hidden;background:#fff;border-radius:13px;border:1px solid var(--border-card);transition:transform .4s var(--ease),box-shadow .4s}.escape-card:hover{transform:translateY(-7px);box-shadow:0 14px 20px #1717170c}.escape-photo{position:relative;display:block;width:100%;height:280px;border:0;padding:0;overflow:hidden;text-align:left;background:var(--surface-muted)}.escape-photo:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,#17171705 10%,#17171710 40%,#17171780 100%);pointer-events:none}.escape-photo>img{width:100%;height:100%;object-fit:cover;transition:transform .8s var(--ease)}.escape-photo:hover>img{transform:scale(1.06)}.destination-label{position:absolute;bottom:43px;left:23px;font-stretch:34%;font-weight:700;font-size:49px;line-height:1;color:white;z-index:1}.photo-tag{position:absolute;bottom:20px;left:24px;font-size:12px;letter-spacing:.12em;color:white;z-index:1}.photo-action{position:absolute;right:18px;top:18px;width:32px;height:32px;border-radius:50%;display:grid;place-items:center;background:#ffffffec;font-size:22px;z-index:1}.escape-info{padding:23px 23px 15px}.escape-info .mono{color:var(--text-secondary);font-size:12px}.escape-info h3{font-size:32px;line-height:1.05;margin-top:10px}.escape-footer{display:flex;justify-content:space-between;align-items:center;margin-top:21px;gap:6px;border-top:1px solid var(--border-card);padding-top:10px}.escape-footer>span{font-size:12px;color:var(--text-secondary)}.save-trip{border:0;background:none;width:36px;height:36px;font-size:26px;line-height:1;transition:transform .2s,color .2s}.save-trip[aria-pressed=true]{color:var(--blue)}.save-trip:hover{transform:scale(1.2)}
.personality{position:relative;display:grid;grid-template-columns:1fr 1fr;min-height:530px;background:var(--koko-ink);border-radius:16px;color:var(--koko-offwhite);padding:58px 54px;overflow:hidden}.personality:before{content:"";position:absolute;inset:0;background-image:linear-gradient(#ffffff07 1px,transparent 1px),linear-gradient(90deg,#ffffff07 1px,transparent 1px);background-size:48px 48px;pointer-events:none}.personality-copy{position:relative;z-index:2}.personality .eyebrow{font-size:12px;color:#c3c3ba}.personality h2{font-size:62px;line-height:.99;margin:23px 0 21px}.personality h2>span{color:var(--accent)}.personality-copy>p:not(.eyebrow){font-size:14px;line-height:1.6;color:#b0b0a7}.personality .button{margin-top:24px}.personality-copy>small{display:block;font-size:12px;color:#b0b0a7;margin-top:14px}.personality-game{position:relative;display:flex;align-items:center;justify-content:center;perspective:1000px}.quiz-deck{position:relative;width:255px;height:330px;transform:rotate(7deg);transition:transform .6s var(--ease);margin-left:30px;margin-top:2px}.personality-game:hover .quiz-deck{transform:rotate(0)}.persona-card{width:230px;height:320px;border:1px solid #171717;border-radius:13px;position:absolute;padding:23px 20px;display:flex;flex-direction:column;justify-content:space-between;box-shadow:3px 5px 0 #0005;transform-origin:bottom center;transition:transform .6s var(--ease)}.persona-card>span{font-size:12px;letter-spacing:.12em;font-weight:650}.persona-back{background:var(--blue);color:#fff;transform:rotate(-25deg) translate(-42px,8px)}.persona-middle{background:#d9ffb0;color:var(--koko-ink);transform:rotate(20deg) translate(44px,0)}.persona-front{background:var(--accent);color:var(--koko-ink);transform:rotate(-4deg)}.personality-game:hover .persona-back{transform:rotate(-33deg) translate(-70px,5px)}.personality-game:hover .persona-middle{transform:rotate(31deg) translate(70px,0)}.question-art{font-stretch:34%;font-size:160px;font-weight:700;line-height:.8;align-self:center;transform:rotate(-9deg)}.persona-front strong{font-stretch:34%;font-size:35px;line-height:.95;letter-spacing:-.02em}.orbit-art{position:relative;height:145px}.orbit-art i{position:absolute;width:140px;height:120px;border:1px solid #fff;border-radius:50%;transform:rotate(40deg);left:15px;top:8px}.orbit-art i:nth-child(2){transform:rotate(-40deg)}.orbit-art i:nth-child(3){transform:rotate(90deg)}.orbit-art b{position:absolute;left:50px;top:15px;font-size:80px;line-height:1}.plate-art{width:160px;height:160px;border:1px solid #171717;border-radius:50%;display:grid;place-items:center;align-self:center;position:relative}.plate-art i{position:absolute;inset:15px;border:1px solid #171717;border-radius:50%}.plate-art b{font-size:90px;line-height:1}.deck-hint{position:absolute;right:20px;bottom:1px;border:0;background:none;color:#fff;transform:rotate(-8deg);font-size:12px}.deck-hint span{font-size:25px;margin-left:8px}
.closing{text-align:center;padding:82px 0 64px}.closing-star{display:block;font-size:46px;color:var(--blue);line-height:1;margin-bottom:23px}.closing .eyebrow{justify-content:center;font-size:12px;color:var(--text-secondary)}.closing h2{font-size:85px;line-height:1;margin-top:16px}.closing-actions{display:flex;gap:12px;justify-content:center;margin-top:28px}.app-links{display:flex;gap:20px;align-items:center;justify-content:center;font-size:12px;margin-top:30px}.app-links>span{color:var(--text-secondary)}.app-links a{text-decoration:underline;text-underline-offset:4px}.site-footer{display:flex;align-items:center;flex-wrap:wrap;border-top:1px solid var(--border-control);padding:27px 0;gap:28px}.site-footer .brand-mark{width:19px;height:21px}.site-footer .brand-word{width:57px;height:19px}.site-footer .brand{gap:9px}.site-footer p{font-size:12px;color:var(--text-secondary)}.site-footer nav{display:flex;gap:23px;margin-left:auto;font-size:12px}.site-footer>small{font-size:12px;color:var(--text-secondary)}.concept-note{text-align:center;background:var(--bg);font-size:12px;color:var(--text-secondary);letter-spacing:.03em;padding:12px 24px;border-top:1px solid var(--border-card)}
dialog{border:1px solid var(--border-card);border-radius:20px;padding:0;width:min(680px,calc(100% - 32px));max-height:90dvh;overflow:auto;color:var(--koko-ink);background:var(--bg);box-shadow:0 20px 100px #0005}dialog::backdrop{background:#17171799;backdrop-filter:blur(5px)}dialog[open]{animation:dialog-in .3s var(--ease)}.dialog-close{position:absolute;right:17px;top:17px;border:1px solid var(--border-card);background:#fff;border-radius:50%;width:35px;height:35px;font-size:25px;line-height:1;display:grid;place-items:center;z-index:5}.dialog-content{padding:43px}.dialog-content h2{font-size:50px;margin:20px 0 15px}.dialog-content>.intro{font-size:14px;color:var(--text-secondary);line-height:1.6}.dialog-options{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:25px}.option-button{display:flex;align-items:center;text-align:left;gap:13px;min-height:95px;border:1px solid var(--border-control);border-radius:12px;padding:18px;background:white;transition:transform .2s,background .2s,border .2s}.option-button:hover{background:#f3ffe4;border-color:#171717;transform:translateY(-2px)}.option-symbol{font-size:30px;width:35px;text-align:center;flex:none;color:var(--blue)}.option-button strong{display:block;font-size:14px}.option-button small{display:block;font-size:12px;color:var(--text-secondary);margin-top:4px;line-height:1.4}.flow-meta{display:flex;justify-content:space-between;align-items:center;color:var(--text-secondary);font-size:12px;margin-top:28px}.flow-back{border:0;background:none;text-decoration:underline;font-size:12px;padding:8px 0}.step-dots{display:flex;gap:5px}.step-dots i{width:24px;height:4px;border-radius:2px;background:var(--border-control)}.step-dots i.active{background:var(--blue)}.result-badge{display:inline-flex;background:var(--accent);padding:7px 12px;font-size:12px;letter-spacing:.07em;font-weight:650;margin-top:25px}.result-photo{height:190px;width:100%;object-fit:cover;border-radius:12px;margin-top:23px}.result-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:24px}.result-note{font-size:12px;line-height:1.5;color:var(--text-secondary);margin-top:16px}.dialog-cover{height:210px;width:100%;object-fit:cover}.trip-dialog-content{padding-top:28px}.trip-dialog-content h2{font-size:44px;margin:12px 0 15px}.day-tabs{display:flex;gap:6px;margin-top:22px;flex-wrap:wrap}.day-tabs button{border:1px solid var(--border-control);padding:8px 14px;background:white;border-radius:8px;font-size:12px}.day-tabs button.active{background:var(--koko-ink);color:white}.day-description{margin-top:20px;font-size:13px;color:var(--text-secondary);line-height:1.7;min-height:65px}.trip-preview-label{font-size:12px;color:var(--text-secondary);margin-top:9px}.toast{position:fixed;bottom:25px;left:50%;transform:translate(-50%,25px);background:var(--koko-ink);color:#fff;border:1px solid #444;border-radius:12px;padding:14px 20px;font-size:12px;box-shadow:0 7px 20px #0003;opacity:0;pointer-events:none;transition:opacity .2s,transform .3s var(--ease);z-index:100;text-align:center;max-width:calc(100% - 32px);width:max-content}.toast.visible{opacity:1;transform:translate(-50%,0)}.result-stamp{position:absolute;right:52px;top:85px;border:2px solid var(--blue);border-radius:50%;width:77px;height:77px;display:flex;align-items:center;justify-content:center;text-align:center;font-size:12px;line-height:1.2;letter-spacing:.05em;color:var(--blue);transform:rotate(16deg);font-weight:650}
@keyframes route-flow{to{stroke-dashoffset:-320}}@keyframes paper-pop{0%{opacity:.5;transform:rotate(-2deg) translateY(10px)}100%{opacity:1;transform:rotate(2deg) translateY(0)}}@keyframes stamp{0%{transform:rotate(-6deg) scale(1.3);opacity:0}100%{transform:rotate(-6deg) scale(1);opacity:1}}@keyframes dialog-in{from{opacity:0;transform:translateY(15px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}
@media(min-width:1550px){.hero{min-height:710px}.hero h1{font-size:104px}.map-canvas{height:310px}.playground{padding-left:22px}.hero-description{font-size:19px}}
@media(max-width:1150px){.nav-wrap nav{margin-left:0;gap:22px}.hero{padding:40px 28px;gap:20px;min-height:620px;grid-template-columns:1fr 1fr}.hero h1{font-size:76px}.hero-description{font-size:16px}.hero-actions{gap:16px;flex-wrap:wrap}.hero-actions .button{padding-inline:17px;font-size:13px;gap:15px}.hero-actions .text-button{font-size:12px}.hero-aside{margin-top:24px}.playground{padding-left:0}.map-canvas{height:260px}.photo-card{width:165px}.photo-card img{height:90px}.map-sticker{width:73px;height:73px;right:-9px;top:6px}.map-sticker b{font-size:19px}.map-sticker span{font-size:12px}.ticket-title{font-size:12px}.playground-top .mono{font-size:12px}.how{padding-inline:25px;gap:45px}.mini-conversation{width:240px;left:0}.real-trip{width:180px;right:0}.real-trip>img{height:330px}.transfer-arrow{left:42%}.how h2{font-size:59px}.personality{padding:50px 40px}.personality h2{font-size:56px}.quiz-deck{scale:.85}.destination-label{font-size:43px}.escape-photo{height:240px}.escape-info h3{font-size:28px}.escape-footer>span{font-size:12px}.site-footer{gap:20px}}
@media(max-width:900px){:root{--gutter:24px}.nav-wrap{height:70px}.nav-wrap nav{gap:20px}.nav-actions .login{display:none}.hero{grid-template-columns:1fr;padding:42px 40px 36px;gap:30px;overflow:hidden}.hero-copy{text-align:center}.hero-copy .eyebrow{justify-content:center;margin-bottom:21px}.hero h1{font-size:94px}.hero-description{font-size:18px}.hero-actions,.hero-note,.hero-aside{justify-content:center}.hero-aside{margin-top:22px}.hero-actions .button{font-size:15px;padding-inline:22px}.hero-actions .text-button{font-size:14px}.playground{width:100%;max-width:530px;margin:5px auto 0}.map-canvas{height:300px}.photo-card{width:195px}.photo-card img{height:112px}.map-sticker{width:88px;height:88px;right:-16px;top:12px}.map-sticker b{font-size:22px}.map-sticker span{font-size:12px}.hero-aside{display:none}.journey-strip{gap:18px;padding-inline:15px}.journey-strip>span:not(.strip-line){font-size:12px;gap:8px}.how{gap:35px;padding:75px 15px;grid-template-columns:1fr 1fr}.how h2{font-size:49px}.how-text>p:not(.eyebrow){font-size:13px}.how-text .eyebrow{font-size:12px}.transformation{height:360px}.mini-conversation{width:205px;top:70px;left:-15px;padding:13px}.real-trip{width:154px;right:-3px}.real-trip>img{height:285px}.mini-chat-header{font-size:12px}.user-message,.ai-message{font-size:12px}.transfer-arrow{font-size:50px;top:20px}.demo-caption{bottom:-6px;font-size:12px}.trip-grid{gap:14px}.escape-photo{height:215px}.escape-info{padding:17px 16px 10px}.escape-info h3{font-size:25px}.escape-footer>span{font-size:12px}.photo-tag{font-size:12px;left:17px}.destination-label{font-size:35px;left:17px}.section-heading h2{font-size:54px}.section-intro p{font-size:12px}.personality{padding:42px 30px;min-height:480px;grid-template-columns:1.1fr 1fr}.personality h2{font-size:51px}.personality .eyebrow{font-size:12px}.quiz-deck{scale:.72;margin-left:0}.personality-game{margin-left:-25px}.personality-copy>small{font-size:12px}.deck-hint{right:0}.closing h2{font-size:75px}.site-footer p{display:none}}
@media(max-width:640px){:root{--gutter:16px}.nav-wrap{height:65px;gap:10px}.nav-wrap nav{display:none}.brand-mark{width:23px;height:25px}.brand-word{width:68px;height:23px}.nav-wrap .button.small{min-height:38px;font-size:12px;gap:16px}.hero{margin-top:16px;padding:32px 19px 24px;gap:26px;border-radius:14px}.hero h1{font-size:clamp(56px,15.8vw,91px);white-space:nowrap}.hero-copy .eyebrow{font-size:12px;margin-bottom:19px}.underlined svg{height:17px;bottom:-7px}.underlined path{stroke-width:9}.hero-description{font-size:15px;line-height:1.6;margin-top:25px}.hero-actions{gap:18px;margin-top:25px}.hero-actions .button{min-height:49px;font-size:12px;gap:13px;padding-inline:17px}.hero-actions .text-button{font-size:12px;gap:8px}.hero-note{font-size:12px;margin-top:12px}.playground{padding:0;margin-top:1px}.playground-top{margin-bottom:9px}.playground-top .mono{font-size:12px}.shuffle{font-size:12px;gap:4px}.shuffle svg{width:12px;height:12px}.idea-bubble{font-size:12px;padding:11px 12px;gap:8px;width:96%;margin-left:0}.bubble-symbol{font-size:22px}.bubble-arrow{font-size:17px}.trip-scene{padding-top:10px}.map-heading{padding:13px 13px 10px}.map-heading h2{font-size:21px}.map-heading .mono{font-size:12px}.map-weather{font-size:12px;padding:4px}.map-canvas{height:231px}.photo-card{left:31%;width:145px;top:48%;padding:5px 5px 7px}.photo-card img{height:77px}.photo-caption{font-size:12px;padding-top:5px}.photo-meta{font-size:12px;margin-top:3px}.map-sticker{width:65px;height:65px;right:-7px;top:9px;box-shadow:2px 3px 0 #171717}.map-sticker b{font-size:17px}.map-sticker span{font-size:12px}.map-pin{width:27px;height:27px;border-width:2px}.map-pin span{font-size:12px}.map-label{font-size:12px}.trip-ticket{padding:17px 11px 12px;gap:7px}.trip-ticket strong{font-size:12px}.trip-ticket div>span{font-size:12px}.ticket-icon{width:26px;height:26px;font-size:19px}.ticket-check{width:20px;height:20px;font-size:12px}.scene-note{font-size:12px;bottom:-7px;right:2px}.destination-bar{margin-top:19px;gap:7px}.destination-switch{padding:3px;gap:2px}.destination-switch button{font-size:12px;padding:6px 9px}.demo-label{font-size:12px}.journey-strip{gap:8px;padding:23px 0;justify-content:space-around}.journey-strip>span:not(.strip-line){font-size:12px;display:block;text-align:center;white-space:normal;line-height:1.7}.journey-strip b{display:block;font-size:12px}.strip-star{display:none}.strip-line{max-width:25px}.how{grid-template-columns:1fr;gap:30px;padding:56px 20px 65px}.how h2{font-size:56px;margin-top:17px}.how-text>p:not(.eyebrow){font-size:14px}.how-text .eyebrow{font-size:12px}.how-text small{font-size:12px}.transformation{width:100%;max-width:375px;margin:0 auto;height:367px}.mini-conversation{left:0;width:220px;top:58px;padding:16px}.real-trip{right:2px;width:167px;top:0}.real-trip>img{height:304px}.mini-chat-header{font-size:12px}.user-message,.ai-message{font-size:12px}.transfer-arrow{left:44%;top:3px}.real-trip-badge{right:-12px;font-size:12px}.demo-caption{left:0;bottom:-7px}.trips{padding:45px 0 52px}.section-heading{display:block;padding:0 10px 25px}.section-heading .eyebrow{font-size:12px}.section-heading h2{font-size:56px;margin-top:16px}.section-intro{margin-top:22px;display:flex;gap:14px;align-items:center;justify-content:space-between}.section-intro p{font-size:12px}.section-intro .text-button{font-size:12px;gap:7px;margin:0}.section-intro .text-button span{font-size:20px}.trip-grid{grid-template-columns:1fr;gap:20px}.escape-photo{height:280px}.destination-label{font-size:49px;left:24px;bottom:42px}.photo-tag{font-size:12px;left:25px}.escape-info{padding:21px 23px 12px}.escape-info h3{font-size:34px}.escape-footer{margin-top:15px}.escape-footer>span{font-size:12px}.escape-info .mono{font-size:12px}.personality{grid-template-columns:1fr;padding:35px 25px 20px;overflow:hidden;gap:0;min-height:auto}.personality .eyebrow{font-size:12px}.personality h2{font-size:54px;margin-top:23px}.personality-copy>p:not(.eyebrow){font-size:14px}.personality-copy>small{font-size:12px}.personality .button{min-height:49px;font-size:13px}.personality-game{height:330px;margin-left:0}.quiz-deck{scale:.74;margin-top:26px;margin-left:26px}.deck-hint{bottom:15px;right:15px;font-size:12px}.closing{padding:57px 10px 43px}.closing-star{font-size:37px;margin-bottom:20px}.closing .eyebrow{font-size:12px}.closing h2{font-size:57px;margin-top:13px}.closing-actions{gap:8px;margin-top:24px;flex-wrap:wrap}.closing-actions .button{font-size:12px;padding-inline:14px;gap:10px;min-height:48px}.app-links{font-size:12px;gap:13px;margin-top:24px;flex-wrap:wrap}.site-footer{gap:20px;padding:23px 5px}.site-footer nav{font-size:12px;gap:16px;flex-wrap:wrap;margin-left:0}.site-footer>small{margin-left:auto}.concept-note{font-size:12px;line-height:1.6;padding:11px 24px}.dialog-content{padding:40px 23px 28px}.dialog-content h2{font-size:43px;padding-right:12px}.dialog-content>.intro{font-size:13px}.dialog-options{gap:9px}.option-button{padding:13px;min-height:94px;gap:8px}.option-symbol{font-size:24px;width:22px}.option-button strong{font-size:12px}.option-button small{font-size:12px}.dialog-content .eyebrow{font-size:12px;padding-right:20px}.result-actions .button{font-size:12px;padding-inline:15px;gap:12px}.result-stamp{width:60px;height:60px;font-size:12px;right:25px;top:86px}.dialog-cover{height:180px}.trip-dialog-content{padding-top:25px}.trip-dialog-content h2{font-size:38px}.day-tabs button{font-size:12px;padding:7px 10px}.day-description{font-size:12px}.result-photo{height:170px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}.route-line{stroke-dasharray:none}}
/* Keep the whole desktop playground within the first screen. */
.island-map{display:none}.map-paper[data-destination="iceland"] .urban-map{display:none}.map-paper[data-destination="iceland"] .island-map{display:block}
.map-heading .mono{display:block;line-height:1.4}.bubble-symbol,.bubble-arrow{line-height:1}
@media(min-width:901px){.hero{padding-top:32px;padding-bottom:28px}.map-canvas{height:240px}.idea-bubble{padding-top:13px;padding-bottom:13px}}
@media(min-width:901px){.photo-card{left:40%;top:35%}}
@media(max-width:640px){.hero h1{font-size:clamp(46px,15.1vw,91px)}.map-pin:before{content:"";position:absolute;inset:-9px}.destination-switch button{min-height:36px}.save-trip{width:44px;height:44px}}
/* Readable sticker: two lines, no microcopy or circular rim. */
.map-sticker{width:164px;height:84px;right:-10px;top:8px;border:1px solid var(--koko-ink);border-radius:9px;transform:rotate(7deg);padding:12px;gap:0;box-shadow:3px 4px 0 var(--koko-ink)}
.map-sticker b{font-size:25px;line-height:1.1;text-align:left;white-space:nowrap}
@media(max-width:640px){.map-sticker{width:128px;height:70px;right:-5px;top:5px;padding:10px;border-radius:7px;box-shadow:2px 3px 0 var(--koko-ink)}.map-sticker b{font-size:20px;line-height:1.1}}
/* Readable secondary type at every breakpoint. */
.eyebrow,.hero-copy .eyebrow,.section-heading .eyebrow,.how-text .eyebrow,.personality .eyebrow,.closing .eyebrow{font-size:13px;line-height:1.5;letter-spacing:.065em}
.hero-note,.hero-aside{font-size:14px;line-height:1.6}
.nav-wrap nav a,.login{font-size:14px}
.playground-top .mono,.map-heading .mono{font-size:12px;letter-spacing:.055em}
.playground-top{flex-wrap:wrap;row-gap:4px;margin-bottom:10px}
.shuffle{font-size:13px;min-height:40px}
.idea-bubble{font-size:15px}
.map-weather{font-size:12px;letter-spacing:.02em}
.map-heading{gap:14px}
.map-heading h2{font-size:28px}
.map-canvas{height:280px}
.map-label{font-size:12px;letter-spacing:.04em}
.label-two{display:none}
.photo-card{width:205px;top:35%;left:39%;padding:8px 8px 10px}
.photo-card img{height:90px}
.photo-caption{font-size:14px;line-height:1.3}
.photo-meta{font-size:12px;line-height:1.4;letter-spacing:.02em}
.trip-ticket{gap:12px;padding:18px 17px;align-items:center}
.ticket-copy{flex:1;min-width:0}
.trip-ticket strong{font-size:16px;line-height:1.35}
.trip-ticket .ticket-copy>span{font-size:13px;line-height:1.5;margin-top:5px}
.hero-download{display:inline-flex;justify-content:center;align-items:center;gap:8px;flex:none;min-height:46px;padding:10px 13px;border:1px solid var(--koko-ink);border-radius:10px;background:var(--koko-ink);color:var(--koko-offwhite);font-size:14px;font-weight:600;white-space:nowrap;transition:background .2s,transform .2s}
.hero-download:hover{background:var(--koko-graphite);transform:translateY(-2px)}
.hero-download svg{width:17px;height:17px;flex:none}
.scene-note{font-size:13px;bottom:-10px}
.destination-switch button{font-size:13px;min-height:38px;padding:8px 13px}
.demo-label{font-size:12px;letter-spacing:.035em}
.destination-bar{flex-wrap:wrap;row-gap:10px;margin-top:21px}
.journey-strip>span:not(.strip-line){font-size:14px}
.journey-strip b{font-size:13px}
.how-text>small,.demo-caption,.personality-copy>small{font-size:13px;line-height:1.5}
.mini-chat-header,.real-trip-badge{font-size:12px;letter-spacing:.04em}
.user-message,.ai-message{font-size:14px;line-height:1.55}
.send-koko{font-size:14px;min-height:44px}
.real-trip{padding-bottom:38px}
.real-trip-caption{font-size:12px;line-height:1.25;padding-inline:8px;bottom:6px}
.real-trip-badge{right:-10px}
.demo-caption{bottom:-22px}
.transformation{height:455px}
.escape-info .mono{font-size:14px;line-height:1.4;letter-spacing:.055em;color:var(--koko-ink)}
.photo-tag{font-size:13px;line-height:1.4;letter-spacing:.045em;bottom:20px;right:20px}
.destination-label{bottom:51px}
.escape-photo:after{background:linear-gradient(180deg,#17171705 10%,#17171710 38%,#171717a8 100%)}
.escape-footer>span{font-size:14px;line-height:1.5;color:var(--text-secondary)}
.escape-footer{gap:12px;min-height:56px}
.save-trip{flex:none;width:44px;height:44px}
.section-intro p,.personality-copy>p:not(.eyebrow){font-size:16px}
.persona-card>span{font-size:12px;line-height:1.35;letter-spacing:.035em}
.persona-card{padding:20px 17px}
.deck-hint{font-size:14px}
.app-links,.site-footer p,.site-footer nav,.site-footer>small{font-size:14px;line-height:1.5}
.site-footer{gap:22px}
.concept-note{font-size:12px;line-height:1.6}
.option-button small,.result-note,.trip-preview-label,.flow-meta,.flow-back,.day-tabs button{font-size:13px;line-height:1.5}
.result-badge{font-size:13px;line-height:1.4}
.download-stores{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:28px}
.download-store{display:flex;align-items:center;gap:15px;min-height:92px;padding:18px;border:1px solid var(--koko-ink);border-radius:12px;background:var(--koko-ink);color:var(--koko-offwhite);transition:transform .2s,background .2s}
.download-store:hover{background:var(--koko-graphite);color:var(--koko-offwhite);transform:translateY(-3px)}
.download-store svg{width:29px;height:29px;flex:none}
.download-store small{font-size:13px;line-height:1.3;color:#d8d8cf;display:block}
.download-store strong{display:block;font-size:20px;line-height:1.4;font-weight:600}
.download-store>span:last-child{margin-left:auto;font-size:22px}
@media(min-width:901px){.hero{padding-top:22px;padding-bottom:22px}.trip-ticket .ticket-icon{display:none}.hero-aside{margin-top:29px}}
@media(min-width:641px) and (max-width:1050px){.escape-footer>span{font-size:14px}.trip-grid{gap:16px}.escape-info{padding-inline:18px}.photo-tag{font-size:13px;left:18px;right:18px}.destination-label{bottom:68px}.transformation{height:465px}.mini-conversation{width:245px;left:-10px}.real-trip{right:-8px}}
@media(max-width:900px){.photo-card{width:205px;left:39%;top:35%}.hero-actions .text-button,.hero-actions .button{font-size:15px}.journey-strip>span:not(.strip-line){font-size:13px}}
@media(max-width:640px){
 .hero-copy .eyebrow,.section-heading .eyebrow,.how-text .eyebrow,.personality .eyebrow,.closing .eyebrow{font-size:13px}
 .hero-description{font-size:16px}.desktop-br{display:none}.hero-note{font-size:13px}.hero-actions{gap:15px}.hero-actions .button{font-size:14px;padding-inline:14px}.hero-actions .text-button{font-size:14px}
 .playground-top{display:block}.playground-top .mono{display:block}.shuffle{margin:1px 0 0 auto}.idea-bubble{font-size:14px;padding:12px;min-height:54px}
 .map-heading{flex-wrap:wrap;gap:8px;padding:15px 13px}.map-heading h2{font-size:25px}.map-heading .mono{font-size:12px}.map-weather{font-size:12px}
 .map-canvas{height:320px}.map-label{font-size:12px;left:5%;top:29%}
 .photo-card{width:145px;left:31%;top:46%;padding:7px 7px 9px}.photo-card img{height:76px}.photo-caption{font-size:13px;line-height:1.3}.photo-meta{font-size:12px;line-height:1.3;letter-spacing:0;margin-top:4px}
 .trip-ticket{flex-wrap:wrap;padding:17px 14px;gap:10px}.trip-ticket .ticket-icon{display:none}.ticket-copy{flex-basis:100%}.trip-ticket strong{font-size:16px}.trip-ticket .ticket-copy>span{font-size:13px}.hero-download{min-height:46px;width:100%;font-size:15px}
 .destination-bar{justify-content:center;margin-top:23px}.destination-switch{width:100%;justify-content:center}.destination-switch button{font-size:14px;padding:8px 12px;min-height:42px;flex:1}.demo-label{font-size:12px}.scene-note{font-size:13px}
 .journey-strip{gap:10px}.journey-strip>span:not(.strip-line){font-size:13px}.journey-strip b{font-size:12px}.strip-line{max-width:16px}
 .how-text>small,.personality-copy>small{font-size:13px}.how-text>p:not(.eyebrow){font-size:16px}
 .transformation{height:460px}.mini-conversation{left:0;width:230px;top:76px}.real-trip{width:167px;right:0}.mini-chat-header{font-size:12px}.user-message,.ai-message{font-size:14px}.real-trip-badge{font-size:12px;right:-7px;padding:8px}.demo-caption{font-size:12px;bottom:-18px}.transfer-arrow{left:38%}
 .section-intro{display:block}.section-intro p{font-size:15px}.section-intro .text-button{font-size:14px;margin-top:15px}.escape-info .mono,.escape-footer>span{font-size:14px}.photo-tag{font-size:13px;left:24px;right:24px}.destination-label{bottom:53px}
 .persona-card>span{font-size:16px;line-height:1.25;letter-spacing:.015em}.persona-card{padding:17px 15px}.persona-front strong{font-size:33px}.question-art{font-size:140px}.deck-hint{font-size:14px}
 .closing-actions .button{font-size:14px;min-height:50px}.app-links{font-size:14px;gap:14px}.app-links>span{flex-basis:100%}.site-footer nav{font-size:14px;gap:18px}.site-footer>small{font-size:13px}.concept-note{font-size:12px}
 .dialog-content .eyebrow{font-size:12px}.option-button strong{font-size:14px}.option-button small{font-size:13px}.result-actions .button,.day-tabs button{font-size:14px}.day-description{font-size:14px}
 .download-stores{grid-template-columns:1fr}.download-store{min-height:86px}
}
/* Compensate for the decorative card fan's responsive scale. */
.persona-card>span{font-size:14px}
@media(max-width:900px){.persona-card>span{font-size:17px}}
/* The three steps are a primary explanation, not a footnote. */
.journey-strip{display:grid;align-items:stretch;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;list-style:none;margin:24px auto 0;padding:30px 32px;background:var(--koko-ink);color:var(--koko-offwhite);border:1px solid var(--koko-ink);border-radius:14px}
.journey-step{display:flex;align-items:flex-start;gap:19px;padding:8px 24px;min-width:0}
.journey-step:first-child{padding-left:0}
.journey-step:last-child{padding-right:0}
.journey-step+.journey-step{border-left:1px solid #4a4a45}
.journey-strip .step-number{font-family:var(--font-sans);font-stretch:34%;font-size:50px;font-weight:700;line-height:1;color:var(--accent);flex:none}
.journey-step h3{font-size:32px;line-height:1.1;margin:0 0 10px}
.journey-step p{font-size:15px;line-height:1.6;color:#d8d8cf;max-width:240px}
.trip-blog-link{display:inline-flex;align-items:center;gap:10px;margin-top:18px;padding:7px 0;font-size:16px;font-weight:600;line-height:1.5;text-decoration:underline;text-underline-offset:4px}
.trip-blog-link:hover{color:var(--blue)}
.trip-blog-link>span{font-size:22px;flex:none;text-decoration:none}
@media(min-width:641px) and (max-width:1000px){.journey-strip{padding:27px 24px}.journey-step{padding:7px 17px;gap:13px}.journey-strip .step-number{font-size:40px}.journey-step h3{font-size:27px}.journey-step p{font-size:14px}}
@media(max-width:640px){.journey-strip{grid-template-columns:1fr;margin-top:20px;padding:10px 24px}.journey-step,.journey-step:first-child,.journey-step:last-child{padding:23px 0;gap:22px}.journey-step+.journey-step{border-left:0;border-top:1px solid #4a4a45}.journey-strip .step-number{font-size:46px;width:42px}.journey-step h3{font-size:31px;margin-bottom:7px}.journey-step p{font-size:15px;max-width:none}.trip-blog-link{font-size:15px}}

.hero-note a{text-decoration:underline;text-underline-offset:3px;color:inherit}.hero-note a:hover{color:var(--blue)}
/* Original travel-type grid, with the larger personality section's typography. */
.personality{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:46px;align-items:center;padding:52px 48px;overflow:visible}
.personality:before{border-radius:16px}
.personality h2{font-size:62px;line-height:1.02}
.personality .personality-copy .personality-question{font-size:20px;font-weight:600;color:var(--koko-offwhite);margin-bottom:10px}
.personality-copy>p:not(.eyebrow){max-width:355px;line-height:1.65}
.personality-copy>small{font-size:14px;color:#d0d0c6}
.types-board{position:relative;min-width:0;padding:24px;background:var(--koko-offwhite);color:var(--koko-ink);border:1px solid #d8d8cf;border-radius:14px;box-shadow:0 7px 0 #aeff4b;align-self:center}
.types-board-top{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap}
.types-board-top .mono{font-size:13px;letter-spacing:.05em}
.type-cities{display:flex;gap:4px;padding:4px;background:#e9e9e1;border-radius:999px}
.type-cities button{font-size:14px;font-weight:550;min-height:36px;border:0;border-radius:999px;padding:7px 14px;background:transparent}
.type-cities button[aria-pressed=true]{background:var(--koko-ink);color:var(--koko-offwhite)}
.type-spotlight{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;column-gap:15px;row-gap:14px;margin:24px 0 22px;min-height:149px}
.type-emoji{font-size:46px;line-height:1}
.type-who h3{font-size:35px;line-height:1.08;overflow-wrap:anywhere}
.type-who p{font-size:15px;line-height:1.5;color:var(--text-secondary);margin-top:7px}
.type-letters{display:flex;gap:5px;grid-column:2}
.type-letters b{font-stretch:34%;display:grid;place-items:center;font-size:22px;line-height:1;width:35px;height:38px;background:var(--koko-ink);color:var(--koko-offwhite);border-radius:6px}
.type-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.type-grid[hidden]{display:none}
.type-tile{display:flex;align-items:center;justify-content:center;gap:10px;min-height:64px;min-width:0;background:#fff;border:1px solid #d8d8cf;border-radius:9px;color:var(--koko-ink);transition:background .18s,border-color .18s,transform .18s}
.type-tile>span:first-child{font-size:25px;line-height:1}
.type-code{font-size:14px;font-weight:600;letter-spacing:.025em}
.type-tile.is-lit,.type-tile:hover{background:var(--accent);border-color:var(--koko-ink);color:var(--koko-ink)}
.type-tile:hover{transform:translateY(-3px)}
.types-board-foot{display:flex;justify-content:space-between;gap:12px 16px;align-items:center;flex-wrap:wrap;margin-top:20px}
.type-hint{font-size:13px;line-height:1.6;color:var(--text-secondary)}
.types-board-foot a{font-size:14px;line-height:1.5;font-weight:600;text-decoration:underline;text-underline-offset:4px;white-space:nowrap}
.types-board-foot a:hover{color:var(--blue)}
.types-board-foot a span{font-size:19px;margin-left:4px}
.footer-brand{display:flex;align-items:center;gap:20px}
.footer-socials{display:flex;gap:8px;padding-left:20px;border-left:1px solid var(--border-control)}
.footer-socials a{display:grid;place-items:center;width:44px;height:44px;border:1px solid var(--border-control);border-radius:10px;background:#fff;transition:background .2s,transform .2s;color:var(--koko-ink)}
.footer-socials a:hover{background:var(--accent);transform:translateY(-3px)}
.footer-socials svg{width:21px;height:21px}
@media(min-width:901px) and (max-width:1150px){.personality{padding:40px 30px;gap:28px;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr)}.personality h2{font-size:54px}.types-board{padding:20px}.type-tile{gap:6px}.type-tile>span:first-child{font-size:22px}.type-code{font-size:13px}}
@media(max-width:900px){.personality{grid-template-columns:1fr;padding:42px;gap:32px}.personality-copy>p:not(.eyebrow){max-width:460px}.personality h2{font-size:62px}.types-board{width:100%;max-width:600px;justify-self:center}.type-spotlight{min-height:134px}}
@media(max-width:640px){.personality{padding:32px 20px 27px;gap:28px}.personality h2{font-size:clamp(42px,13vw,56px)}.personality .personality-copy .personality-question{font-size:18px}.personality-copy>small{font-size:13px}.types-board{padding:18px 14px;border-radius:11px}.types-board-top{gap:12px}.types-board-top .mono{font-size:12px}.type-cities button{font-size:14px;padding:7px 13px}.type-spotlight{margin-top:22px;column-gap:10px;min-height:160px;row-gap:14px}.type-emoji{font-size:35px}.type-who h3{font-size:30px}.type-who p{font-size:14px}.type-letters{grid-column:1 / -1}.type-letters b{width:32px;height:35px;font-size:21px}.type-grid{gap:6px}.type-tile{flex-direction:column;gap:8px;min-height:78px;padding:10px 0}.type-tile>span:first-child{font-size:26px}.type-code{font-size:13px;letter-spacing:0}.types-board-foot{gap:12px;margin-top:16px}.type-hint{font-size:13px}.footer-brand{gap:20px}.site-footer nav{flex-basis:100%;margin-left:0}.site-footer>small{margin-left:0}}
@media(hover:none){.hover-hint{display:none}}

/* One explanation, read left to right: ask, send, open. */
.handoff{padding:64px 0 66px}
.handoff-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:32px;padding:0 5px 32px}
.handoff-heading h2{font-size:62px;line-height:1.02;margin-top:18px}
.handoff-connect{padding-bottom:5px;text-align:center;flex:none}
.handoff-connect .button{font-size:16px;min-height:54px}
.handoff-connect p{font-size:15px;line-height:1.5;margin-top:13px;color:var(--text-secondary)}
.handoff-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));list-style:none;padding:0;margin:0;border:1px solid var(--koko-ink);border-radius:15px;background:var(--koko-ink);overflow:hidden}
.handoff-step{min-width:0;padding:0 12px 12px}
.handoff-step+.handoff-step{border-left:1px solid #474740}
.handoff-step-heading{display:flex;align-items:center;gap:15px;padding:24px 15px;color:var(--koko-offwhite)}
.handoff-number{font-stretch:34%;font-size:43px;font-weight:700;line-height:1;color:var(--accent)}
.handoff-step-heading h3{font-size:32px;line-height:1.1}
.handoff-example{height:388px;border-radius:9px;padding:24px;background:var(--koko-offwhite);color:var(--koko-ink);overflow:hidden}
.handoff-chat-label{display:flex;align-items:center;gap:8px;font-size:16px;font-weight:650;margin-bottom:20px}
.handoff-chat-label>span{color:var(--blue);font-size:25px;line-height:1}
.handoff-message{font-size:16px;line-height:1.55;background:#e9e9e1;border-radius:13px 13px 3px 13px;padding:14px 17px;margin-left:10px}
.handoff-itinerary{margin-top:25px;display:grid;gap:17px}
.handoff-itinerary p{display:grid;grid-template-columns:43px minmax(0,1fr);gap:12px;font-size:15px;line-height:1.5}
.handoff-itinerary b{font-weight:600;color:var(--koko-ink)}
.handoff-itinerary p>span{color:var(--text-secondary)}
.handoff-send{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:26px}
.handoff-send .handoff-message{align-self:stretch;display:flex;justify-content:space-between;gap:12px;margin:0;font-size:18px;font-weight:550}
.handoff-message>span{font-size:22px;font-weight:400}
.handoff-down{font-size:36px;line-height:1;color:var(--blue);margin:13px 0}
.handoff-trip-card{width:100%;padding:20px;background:#fff;border:1px solid #d8d8cf;border-radius:12px;box-shadow:0 5px 0 #e3e3d9}
.handoff-trip-status{display:flex;align-items:center;justify-content:space-between;gap:12px}
.handoff-trip-status img{width:27px;height:29px;object-fit:contain}
.handoff-trip-status>span{font-size:15px;display:flex;align-items:center;gap:8px}
.handoff-trip-status b{display:grid;place-items:center;width:24px;height:24px;border-radius:50%;background:var(--accent);font-weight:600}
.handoff-trip-card h4{font-stretch:34%;font-size:28px;line-height:1.12;margin:17px 0 12px;font-weight:700}
.handoff-trip-card>p{font-size:15px;line-height:1.5;color:var(--text-secondary)}
.handoff-result{display:flex;flex-direction:column;align-items:center;gap:20px;background:#eaf2e2;padding:22px 16px 0}
.handoff-result>p{font-size:16px;font-weight:550;line-height:1.5;text-align:center;margin:0}
.handoff-phone{margin:0;width:226px;max-width:100%;padding:6px;background:var(--koko-ink);border-radius:26px 26px 0 0;box-shadow:0 8px 30px #17171720}
.handoff-phone img{width:100%;height:auto;border-radius:20px 20px 0 0}
.handoff-demo-note{font-size:13px;line-height:1.5;color:var(--text-secondary);text-align:right;margin:12px 5px 0}
@media(min-width:901px) and (max-width:1100px){.handoff-example{padding:20px;height:405px}.handoff-step-heading{padding:23px 9px;gap:11px}.handoff-step-heading h3{font-size:28px}.handoff-number{font-size:39px}.handoff-message{margin-left:0;padding:12px}.handoff-itinerary p{gap:8px}.handoff-trip-card{padding:16px}.handoff-trip-card h4{font-size:25px}.handoff-result{padding:22px 12px 0}}
@media(max-width:900px){.handoff{padding:52px 0 55px}.handoff-heading{gap:24px}.handoff-heading h2{font-size:56px}.handoff-connect .button{font-size:15px;padding-inline:18px}.handoff-steps{grid-template-columns:1fr;gap:0}.handoff-step{padding:0 18px 18px}.handoff-step+.handoff-step{border-left:0;border-top:1px solid #474740}.handoff-step-heading{padding:22px 9px}.handoff-example{height:auto;min-height:0;padding:25px;max-width:none}.handoff-plan{display:grid;grid-template-columns:1fr 1fr;column-gap:30px}.handoff-chat-label{grid-column:1 / -1}.handoff-plan .handoff-message{margin:0;align-self:start}.handoff-itinerary{margin:0}.handoff-send{display:grid;grid-template-columns:1fr auto 1fr;gap:18px}.handoff-send .handoff-message{align-self:center}.handoff-down{transform:rotate(-90deg);margin:0}.handoff-trip-card h4{font-size:28px}.handoff-result{height:395px;padding-bottom:0}.handoff-phone{width:250px}}
@media(max-width:640px){.handoff{padding:47px 0 48px}.handoff-heading{display:block;padding:0 10px 26px}.handoff-heading h2{font-size:clamp(44px,13.5vw,56px);margin-top:16px}.handoff-connect{display:flex;flex-wrap:wrap;align-items:center;text-align:left;gap:12px 18px;margin-top:24px;padding:0}.handoff-connect p{font-size:14px;margin:0}.handoff-connect .button{min-height:50px;font-size:15px}.handoff-step{padding:0 12px 12px}.handoff-step-heading{padding:21px 9px;gap:14px}.handoff-step-heading h3{font-size:31px}.handoff-number{font-size:42px}.handoff-example{padding:22px 20px}.handoff-plan{display:block}.handoff-message{font-size:16px;margin-left:0}.handoff-chat-label{margin-bottom:17px}.handoff-itinerary{margin-top:23px;gap:16px}.handoff-itinerary p{font-size:15px;gap:10px}.handoff-send{display:flex;gap:0}.handoff-send .handoff-message{align-self:stretch;font-size:18px}.handoff-down{transform:none;margin:14px 0}.handoff-trip-card h4{font-size:29px}.handoff-result{height:390px;padding:22px 12px 0;gap:18px}.handoff-result>p{font-size:15px}.handoff-phone{width:230px}.handoff-demo-note{text-align:left;font-size:13px;margin-inline:10px}}

.escape-photo{display:block}
.escape-info h3 a:hover{color:var(--blue)}

/* Language belongs with the brand; account actions form their own pair. */
.site-header .nav-wrap{height:88px;gap:32px}
.nav-identity{display:flex;align-items:center;gap:30px;min-width:0}
.nav-language{padding-left:26px;border-left:1px solid var(--border-control)}
.site-header .kk-lang>summary{height:44px;padding:0 8px;border:0;border-radius:8px;background:transparent;font-size:14px;font-weight:500;color:var(--text-secondary)}
.site-header .kk-lang>summary:hover,.site-header .kk-lang[open]>summary{background:var(--surface);color:var(--koko-ink)}
.site-header .kk-lang-menu{left:0;right:auto}
.site-header .nav-actions{gap:14px;flex:none}
.site-header .login{display:inline-flex;align-items:center;justify-content:center;min-height:44px;min-width:88px;padding:0 20px;border:1px solid var(--border-control);border-radius:999px;background:transparent;font-size:14px;font-weight:600}
.site-header .login:hover{background:var(--surface);border-color:var(--koko-ink);color:var(--koko-ink)}
.site-header .button.small{min-height:44px;min-width:132px;padding-inline:22px;gap:22px;border-radius:999px;font-size:14px}
.site-header .button.small span{font-size:21px}
@media(max-width:640px){
  .site-header .nav-wrap{height:72px;gap:12px}
  .nav-identity{gap:12px}
  .nav-language{padding:0;border:0}
  .site-header .kk-lang>summary{height:40px;padding:0}
  .site-header .nav-actions{gap:8px}
  .site-header .login{min-height:40px;min-width:0;padding:0 14px;font-size:13px}
  .site-header .button.small{min-height:40px;min-width:0;padding-inline:15px;gap:12px;font-size:13px}
}
@media(max-width:380px){
  .site-header .brand-mark{display:none}
  .nav-identity{gap:8px}
  .site-header .nav-actions{gap:6px}
  .site-header .login{padding-inline:12px}
  .site-header .button.small{padding-inline:12px;gap:8px}
}
