@font-face{font-family:Caveat;src:url('/gate-assets/caveat.woff2') format('woff2');font-weight:400 700;font-display:swap}
@font-face{font-family:'DM Sans';src:url('/gate-assets/dm-sans.woff2') format('woff2');font-weight:400 700;font-display:swap}
/* Denim, notebook paper, and actual pictures: a personal page rather than a product landing page. */
body.stitch-login{--bg:#132331;--text:#f0f3ef;--muted:#a4b5bc;background:#132331;color:#f0f3ef;font-family:'DM Sans',system-ui,sans-serif;position:relative;isolation:isolate}
.stitch-login:before{content:'';position:fixed;inset:0;z-index:-1;pointer-events:none;opacity:.12;background-image:url('/gate-assets/paper-grain.svg')}
.stitch-login header{max-width:1360px;padding:30px 50px}
.stitch-login .brand{font-family:'DM Sans',system-ui,sans-serif;letter-spacing:-.5px;font-size:20px;gap:10px}
.stitch-login .brand-mark{border:0;background:transparent;color:#9ebcd3;border-radius:0;width:28px;height:32px;transform:rotate(-7deg)}
.stitch-login .brand span:last-child{color:#9bb0bf;border-color:#3b4d5a;font-size:10px;letter-spacing:1.8px}
.stitch-login .private{font-size:10px;letter-spacing:.3px;text-transform:none;color:#b2c2ca}
.stitch-login .dot{width:5px;height:5px;background:#a9c4b6;box-shadow:none}
.stitch-layout{max-width:1270px;margin:0 auto;display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);align-items:center;gap:55px;padding:16px 55px 50px;min-height:calc(100svh - 160px)}
.stitch-board{position:relative;min-height:660px;align-self:center}
.board-note{font-size:11px;letter-spacing:.2px;color:#b6c7d0;margin:12px 0 4px 8px}
.ohana{font-family:Caveat,cursive;font-weight:700;font-size:112px;letter-spacing:-4px;line-height:1;margin:0 0 3px;color:#e5eff5;transform:rotate(-4deg);transform-origin:left bottom;position:relative;z-index:4}
.ohana span{color:#7ba8c8}
.handwritten{font-family:Caveat,cursive;font-weight:500;letter-spacing:.1px}
.board-subtitle{font-size:26px;color:#b0c7d8;transform:rotate(-3deg);position:relative;z-index:5;margin:0 0 0 11px}
.stitch-collage{position:relative;height:442px;margin-top:8px}
.notebook-lines{position:absolute;inset:52px 21px 27px 42px;border:1px solid #536e8144;transform:rotate(-5deg);background:repeating-linear-gradient(transparent 0,transparent 25px,#6e8ea11a 25px,#6e8ea11a 26px);border-radius:2px}
.notebook-lines:after{content:'';position:absolute;top:0;bottom:0;left:30px;border-left:1px solid #668d9f33}
.standing-stitch{position:absolute;z-index:3;width:315px;height:405px;object-fit:contain;left:146px;top:-2px;transform:rotate(4deg);filter:drop-shadow(1px 4px 0 #90b4cb) drop-shadow(-1px -1px 0 #90b4cb) drop-shadow(8px 16px 12px #0005)}
.mood-photo,.sketch-photo{position:absolute;margin:0;padding:9px 9px 0;background:#f0efe6;box-shadow:2px 7px 13px #04101b80;border:1px solid #d5d6cb;z-index:2}
.mood-photo{width:151px;left:-4px;top:44px;transform:rotate(-9deg)}
.mood-photo img{width:131px;height:224px;display:block;object-fit:contain;background:#030303}
.mood-photo figcaption{font-family:Caveat,cursive;color:#3f5261;font-size:16px;text-align:center;line-height:1.2;padding:7px 0 10px;white-space:nowrap}
.tape{position:absolute;left:50%;top:-11px;width:67px;height:24px;background:#c5bc94bb;transform:translateX(-50%) rotate(5deg);z-index:5;border-left:1px dashed #ede5c44d;border-right:1px dashed #ede5c44d;box-shadow:0 1px 1px #20304733}
.sketch-photo{width:151px;right:-6px;bottom:0;transform:rotate(8deg);z-index:4}
.sketch-photo img{display:block;width:131px;height:174px;object-fit:contain;background:#faf7f4}
.sketch-photo .tape{transform:translateX(-50%) rotate(-12deg);background:#a6b8bac7}
.sketch-photo figcaption{font-family:Caveat,cursive;color:#3c4b55;font-size:15px;line-height:1.3;text-align:center;padding:6px 0 9px}
.stamp-626{position:absolute;left:25px;bottom:28px;font:700 45px/1 'DM Sans',sans-serif;letter-spacing:4px;transform:rotate(-11deg);border:2px solid #87a2b484;color:#87a2b484;border-radius:50%;width:99px;height:99px;text-align:center;padding-top:16px}
.stamp-626 small{display:block;font-size:6px;letter-spacing:1px;margin-top:7px;white-space:nowrap}
.board-scribble{position:absolute;right:0;top:-40px;width:110px;height:75px;color:#99b9cc;transform:rotate(14deg)}
.board-bottom{margin:9px 0 0 100px;font-size:23px;transform:rotate(-2deg);color:#a2becf}
.login-paper{--text:#203647;--muted:#62717a;--blue:#346c92;--line:#c6d0d1;position:relative;min-height:510px;background:#eceee5;color:#203647;transform:rotate(1deg);padding:52px 41px 31px 50px;box-shadow:7px 9px 0 #0b172566,0 18px 45px #050c182b;border:1px solid #c0cdcd;border-radius:3px 8px 9px 2px}
.login-paper:before{content:'';position:absolute;inset:0;pointer-events:none;opacity:.25;background-image:url('/gate-assets/paper-grain.svg');border-radius:inherit}
.login-paper:after{content:'';position:absolute;left:25px;top:0;bottom:0;width:1px;background:#b8837955}
.paper-binding{position:absolute;left:-7px;top:24px;bottom:24px;width:15px;background:radial-gradient(ellipse at 6px 8px,#132331 0 4px,transparent 4.6px) 0 0/15px 29px}
.pin-sticker{position:absolute;right:-26px;top:-45px;width:104px;height:104px;border-radius:50%;object-fit:cover;border:3px solid #d8e0de;box-shadow:3px 4px 8px #07131d55;transform:rotate(13deg);z-index:3}
.paper-label{font:600 9px 'DM Sans',sans-serif;letter-spacing:1.7px;color:#6d7e82;margin:0 0 23px}
.login-paper h1{font:700 43px/1.15 'DM Sans',sans-serif;letter-spacing:-1.7px;margin:0 0 10px}
.login-intro{font-size:12px;color:#64727a;line-height:1.8;margin:0 0 30px}
.login-paper form{position:relative;z-index:1}
.login-paper .field{margin-bottom:19px}
.login-paper .field label{font-size:11px;color:#334955;font-weight:600;margin-bottom:8px}
.login-paper .field input{background:#f8f8f1;border:1px solid #b6c6ca;color:#233a49;border-radius:4px;height:49px;font:13px 'DM Sans',sans-serif;padding-left:40px;padding-right:40px}
.login-paper .field input::placeholder{color:#89999d}
.login-paper .field input:focus{border-color:#5280a1;outline:3px solid #5a87a11c;background:#fffdf7}
.login-paper .input-wrap>svg{left:14px;top:16px;width:15px;height:15px;stroke:#7b929a}
.login-paper .reveal{color:#768b94;right:5px;top:7px}
.login-paper .submit{border:1px solid #325e7b;border-radius:5px;background:#315f7c;color:#f2f4ec;font:600 13px 'DM Sans',sans-serif;height:49px;margin-top:24px;box-shadow:2px 3px 0 #a7b9bd;gap:20px}
.login-paper .submit:hover{background:#264f6b;transform:translateY(-1px)}
.login-paper .submit svg{transform:rotate(-8deg);width:24px;stroke-width:1.6}
.login-paper .message{color:#9b402f;font-size:11px}
.login-paper .message.success{color:#326449}
.paper-foot{margin-top:26px;border-top:1px dashed #bac8c7;padding-top:16px;display:flex;justify-content:space-between;align-items:center;gap:10px}
.paper-foot>span:first-child{font-size:9px;color:#75868c;display:flex;align-items:center;gap:5px}
.paper-foot svg{width:11px;height:11px;fill:none;stroke:currentColor;stroke-width:1.6}
.paper-foot .handwritten{font-size:20px;color:#526e81;transform:rotate(-5deg)}
.art-credits{display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:13px;font:9px 'DM Sans',sans-serif;color:#8aa2b0;margin:-11px auto 23px;padding:0 25px}
.art-credits span{color:#698493}
.art-credits a{border-bottom:1px solid #5e7787;padding-bottom:2px}
.art-credits a:hover{color:#d7e5ed}
.stitch-login footer{max-width:1360px;padding:12px 50px 25px;color:#6d8999;font-size:8px;letter-spacing:.6px}
.private-page .welcome-hero img{height:150px;object-fit:contain;filter:drop-shadow(0 4px 0 #698cac)}
.private-page button[data-logout]{border:1px solid #5c7892;border-radius:6px;background:#1e354b;color:#edf6fc;padding:8px 13px}
@media(min-width:1500px){.stitch-layout{padding-top:35px;padding-bottom:50px;gap:70px}.stitch-board{min-height:700px}.stitch-collage{height:460px}.standing-stitch{width:340px;height:437px;left:140px}.login-paper{min-height:540px;padding-top:62px;padding-bottom:40px}}
@media(max-width:1100px) and (min-width:761px){.stitch-layout{padding:20px 40px 40px;gap:35px;grid-template-columns:1fr 1fr}.stitch-board{min-height:600px}.ohana{font-size:94px}.board-subtitle{font-size:22px;max-width:310px}.stitch-collage{height:410px}.standing-stitch{width:260px;height:334px;left:65px;top:30px}.mood-photo{left:-8px;top:45px;width:115px;padding:7px 7px 0}.mood-photo img{width:99px;height:171px}.mood-photo figcaption{font-size:12px}.sketch-photo{width:121px;right:-2px}.sketch-photo img{width:101px;height:135px}.sketch-photo figcaption{font-size:12px}.stamp-626{left:5px;bottom:30px}.board-bottom{font-size:20px;margin-left:20px}.login-paper{padding:45px 26px 28px 37px}.login-paper:after{left:19px}.login-paper h1{font-size:37px}.pin-sticker{right:-17px;width:90px;height:90px}.paper-foot .handwritten{font-size:18px}.paper-foot>span:first-child{font-size:8px}.board-scribble{right:-12px;top:-20px;width:85px}}
@media(max-width:760px){.stitch-login header{padding:24px 24px 12px}.stitch-login .brand{font-size:19px}.stitch-login .private{font-size:9px}.stitch-layout{display:flex;flex-direction:column;gap:26px;padding:0 29px 35px;min-height:0;max-width:550px}.stitch-board{min-height:0;width:100%;height:310px}.board-note{font-size:10px;margin:17px 0 0}.ohana{font-size:74px;margin:0;line-height:1.05}.board-subtitle{font-size:19px;max-width:190px;margin-left:3px;line-height:1.1}.stitch-collage{height:210px;margin-top:-12px}.standing-stitch{height:224px;width:174px;left:auto;right:29px;top:-35px;transform:rotate(7deg);filter:drop-shadow(1px 2px 0 #90b4cb) drop-shadow(-1px -1px 0 #90b4cb) drop-shadow(5px 8px 7px #0004)}.notebook-lines{inset:6px 10px 12px 14px}.mood-photo{width:82px;left:3px;top:26px;padding:5px 5px 0;transform:rotate(-11deg)}.mood-photo img{width:70px;height:122px}.mood-photo figcaption{font-size:8px;line-height:1.3;padding:4px 0 6px}.tape{width:39px;height:15px;top:-7px}.sketch-photo{width:79px;right:0;bottom:-4px;padding:5px 5px 0;transform:rotate(9deg)}.sketch-photo img{width:67px;height:90px}.sketch-photo figcaption{font-size:8px;padding:3px 0 5px}.stamp-626{font-size:25px;width:61px;height:61px;left:105px;bottom:4px;padding-top:9px;letter-spacing:2px}.stamp-626 small{font-size:4px;letter-spacing:.4px;margin-top:4px}.board-scribble{width:63px;right:6px;top:-56px}.board-bottom{display:none}.login-paper{width:100%;padding:35px 27px 25px 37px;min-height:0;transform:rotate(.7deg);border-radius:2px 5px 7px 2px}.login-paper:after{left:19px}.paper-binding{top:20px;bottom:20px}.pin-sticker{right:15px;top:20px;width:62px;height:62px;border-width:2px}.paper-label{font-size:8px;letter-spacing:1.2px;margin-bottom:19px}.login-paper h1{font-size:34px;letter-spacing:-1.1px}.login-intro{font-size:11px;margin-bottom:24px}.login-paper .field{margin-bottom:18px}.login-paper .field input{font-size:16px;height:49px}.login-paper .field label{font-size:10px}.login-paper .submit{height:48px;margin-top:22px;font-size:12px}.paper-foot{margin-top:23px;padding-top:12px}.paper-foot .handwritten{font-size:19px}.paper-foot>span:first-child{font-size:8px}.art-credits{font-size:8px;gap:9px;margin:0 auto 20px}.art-credits span{width:100%;text-align:center}.stitch-login footer{padding:4px 25px 24px;font-size:7px;gap:18px}}
@media(max-width:360px){.stitch-layout{padding-left:23px;padding-right:23px}.standing-stitch{right:15px;width:158px;height:204px;top:-23px}.board-subtitle{font-size:18px}.login-paper{padding-left:33px;padding-right:21px}.paper-foot .handwritten{font-size:17px}.stitch-login header{padding-left:20px;padding-right:20px}.stitch-login .private{font-size:8px}}

.brand-mark img{width:31px;height:31px;border-radius:50%;object-fit:cover}
/* Final user-selected image set: tropical print, cheeky Stitch, peeking Stitch, embroidery. */
.standing-stitch{width:310px;height:310px;left:142px;top:28px;background:#fff;border:8px solid #f1f0e8;box-shadow:3px 9px 15px #04101b88;filter:none;transform:rotate(5deg)}
.sketch-photo{width:151px;right:-6px;bottom:0}
.sketch-photo img{width:131px;height:131px;object-fit:contain;background:#fff}
.peek-stitch{position:absolute;top:13px;right:26px;width:136px;height:76px;object-fit:contain;mix-blend-mode:multiply;transform:rotate(-2deg)}
.private-page .welcome-hero img{height:130px;border-radius:12px;background:#fff;filter:none}
@media(min-width:1500px){.standing-stitch{width:325px;height:325px;left:143px;top:35px}}
@media(max-width:1100px) and (min-width:761px){.standing-stitch{width:242px;height:242px;left:68px;top:58px;border-width:6px}.sketch-photo{width:121px}.sketch-photo img{width:101px;height:101px}.peek-stitch{right:16px;top:15px;width:105px;height:59px}}
@media(max-width:760px){.standing-stitch{width:165px;height:165px;left:auto;right:28px;top:-3px;border-width:5px;transform:rotate(7deg)}.sketch-photo{width:79px;right:0;bottom:-4px}.sketch-photo img{width:67px;height:67px}.peek-stitch{width:99px;height:55px;top:13px;right:15px}}
@media(max-width:360px){.standing-stitch{width:149px;height:149px;right:15px;top:6px}.peek-stitch{width:88px;height:49px;top:15px;right:11px}}
/* A small dose of midnight blue against the notebook paper. */
.login-paper .field input{background:#192f40;border-color:#405e71;color:#eaf2f7;box-shadow:inset 0 2px 4px #07141e33}
.login-paper .field input::placeholder{color:#9fb4c2}
.login-paper .field input:focus{background:#203b4d;border-color:#77a7c0;outline-color:#54809c26}
.login-paper .input-wrap>svg{stroke:#9cb9ca}
.login-paper .reveal{color:#adc6d4}
.login-paper .submit{background:#16384f;border-color:#153146}
.login-paper .submit:hover{background:#244e69}