@font-face{font-family:Inter;font-display:swap;src:url('/assets/yohaku/Inter-variable.ttf')}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:85px}body{margin:0;background:#f7f6f2;color:#292e29;font-family:Inter,'PingFang TC','Microsoft JhengHei',sans-serif;-webkit-font-smoothing:antialiased}body:before{content:'';position:fixed;inset:0;pointer-events:none;z-index:20;opacity:.09;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' opacity='.4' filter='url(%23n)'/%3E%3C/svg%3E")}a{color:inherit;text-decoration:none}button{font:inherit;cursor:pointer}button,a,summary{-webkit-tap-highlight-color:transparent}a:focus-visible,button:focus-visible,summary:focus-visible{outline:2px solid #5b6e5d;outline-offset:6px}header{height:84px;display:flex;align-items:center;justify-content:space-between;padding:0 4.5%;position:sticky;top:0;z-index:30;background:#f7f6f2ed;backdrop-filter:blur(15px);border-bottom:1px solid #daddd570}.brand{display:flex;align-items:center;gap:12px;font-size:23px;font-weight:450;letter-spacing:-.5px}.brand img{width:44px;height:32px;object-fit:contain}nav{display:flex;gap:34px;font-size:13px}nav a:hover{color:#79896d}.small-cta{background:#5b6e5d;color:#fff;border-radius:30px;padding:12px 23px;font-size:12px}.small-cta span{margin-left:18px}.reading-progress{position:fixed;top:0;left:0;height:2px;background:#657c59;width:0;z-index:40}.hero{padding:76px 5% 0;text-align:center;position:relative;overflow:hidden}.eyebrow,.section-index{font-size:10px;letter-spacing:2.5px;color:#7b8479;font-weight:500}.hero h1{font:400 clamp(36px,4.9vw,78px)/1.35 'Songti TC','Noto Serif TC','PMingLiU',serif;letter-spacing:4px;margin:23px 0 17px}.hero h1 span{color:#798a72}.hero p{font-size:15px;letter-spacing:2px;line-height:1.9;color:#757c72}.button{display:inline-flex;gap:42px;align-items:center;background:#5b6e5d;color:#fff;border-radius:40px;padding:18px 27px;font-size:13px;transition:background .2s,transform .2s}.button:hover{background:#435344;transform:translateY(-3px)}.hero>.button{margin-top:16px}.scroll-link{display:block;width:max-content;margin:24px auto 0;font-size:10px;letter-spacing:2px;color:#83897d}.scroll-link span{display:inline-block;margin-left:14px}.hero-note{position:absolute;right:5%;top:225px;text-align:left;font-family:'Songti TC',serif;font-size:12px;line-height:2.2;letter-spacing:2px;color:#909485;border-left:1px solid #c4caba;padding-left:20px}.preview{position:relative;max-width:1090px;margin:45px auto 0;border:1px solid #d8dcd1;border-radius:13px;background:#faf9f5;box-shadow:0 35px 60px -35px #52604e66;transform:perspective(1500px) rotateX(7deg);transform-origin:50% 0;will-change:transform}.app-bar{height:48px;border-bottom:1px solid #dedfd5;display:flex;justify-content:space-between;align-items:center;padding:0 22px;font-size:11px;text-align:left}.app-bar>span{display:flex;align-items:center;gap:9px}.app-bar img{width:27px}.app-bar i{font-style:normal;color:#999c92}.bar-right{color:#999c92;font-size:9px}.bar-right b{font-size:17px;font-weight:400;margin:0 15px}.hero-map{height:410px;position:relative;margin:0 65px}.hero-map svg,.living-map svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}.hero-map path{fill:none;stroke:#8b9980;stroke-width:1}.thought{position:absolute;transform:translate(-50%,-50%);width:165px;padding:16px;background:#eeede4;border:1px solid #c8cbbd;border-radius:40% 47% 43% 40%;font:22px 'Songti TC',serif;white-space:nowrap}.thought small{display:block;font:10px Inter,'PingFang TC',sans-serif;color:#7e8377;margin-top:8px;letter-spacing:1px}.thought.center{left:50%;top:50%;width:195px;padding:25px 15px;background:#dde5d6;font-size:27px}.t1{left:21%;top:24%;transform:translate(-50%,-50%) rotate(-4deg)}.t2{left:79%;top:21%;background:#eee5dc}.t3{left:20%;top:79%;background:#e8ece7}.t4{left:79%;top:80%;background:#e5e8d9}.mini-tools{position:absolute;top:100px;left:18px;line-height:38px;width:30px;font-size:18px;border:1px solid #e1e2d8;border-radius:7px;color:#72786c}.handwriting{position:absolute;bottom:30px;left:40%;font:16px 'Songti TC',serif;transform:rotate(-8deg);color:#7d8272;letter-spacing:3px}.leaf-art{position:absolute;left:48%;top:12%;height:60px;width:1px;background:#9aab8f;transform:rotate(30deg)}.leaf-art i{position:absolute;width:21px;height:12px;border-radius:2px 90%;background:#9cae9090;left:0;top:0}.leaf-art i:nth-child(2){top:12px;left:-20px;transform:rotate(65deg)}.leaf-art i:nth-child(3){top:22px}.leaf-art i:nth-child(4){top:34px;left:-20px;transform:rotate(65deg)}.leaf-art i:nth-child(5){top:44px}.hero-bottom{max-width:1090px;margin:30px auto 0;display:flex;justify-content:space-between;font-size:10px;letter-spacing:1.4px;color:#8b9184;padding-bottom:65px;border-bottom:1px solid #daddd5}.mobile-break{display:none}h2{font:400 clamp(32px,3.7vw,55px)/1.55 'Songti TC','Noto Serif TC','PMingLiU',serif;letter-spacing:3px;margin:17px 0 24px}p{font-size:14px;line-height:2;color:#788073}.flow-section{height:225vh;position:relative}.flow-sticky{position:sticky;top:84px;height:calc(100vh - 84px);min-height:620px;display:flex;flex-direction:column;justify-content:center;align-items:center;overflow:hidden}.flow-heading{text-align:center}.flow-heading h2{margin:10px 0}.flow-heading p{margin:0;min-height:28px}.living-map{position:relative;width:min(1000px,90vw);height:min(380px,42vh);min-height:270px;margin:15px auto}.growing-line{fill:none;stroke:#89937a;stroke-width:1.1;stroke-dasharray:1;stroke-dashoffset:1}.map-root,.map-node{position:absolute;transform:translate(-50%,-50%);text-align:center}.map-root{left:50%;top:50%;background:#dde4d4;padding:25px 30px;border-radius:50%;font:22px 'Songti TC',serif;z-index:2}.map-root span{display:block;font:10px Inter,sans-serif;letter-spacing:2px;color:#7c886f;margin-top:10px}.map-node{background:#f2f0e8;border:1px solid #d4d6c9;padding:17px 28px;border-radius:8px;opacity:0;min-width:195px;font-size:16px}.map-node small{display:block;font-size:10px;color:#89907f;margin-top:8px}.map-node em{display:block;font:10px Inter,sans-serif;color:#87977a;margin-bottom:9px}.n1{left:19.5%;top:23%}.n2{left:80.5%;top:23%}.n3{left:19.5%;top:80%}.n4{left:80.5%;top:80%}.ink-underline{position:absolute;width:160px;height:5px;background:#92a47c88;left:42%;top:67%;transform:rotate(-3deg) scaleX(0);transform-origin:left;border-radius:70% 20%}.flow-steps{display:flex;gap:50px;font-size:11px;color:#adb0a6}.flow-steps span{padding:12px 0;border-bottom:1px solid transparent}.flow-steps .active{color:#4e6446;border-color:#4e6446}.flow-caption{font-size:9px;letter-spacing:2px;color:#979e8d;margin-top:24px}.flow-caption span{margin-left:20px}.section-pad{padding:110px max(6%,calc((100% - 1180px)/2))}.touch{background:#eeede5}.touch-grid{display:grid;grid-template-columns:1fr 1.1fr;gap:90px;align-items:center;margin-top:40px}.touch h2{margin-top:0}.touch p{line-height:2.2}.pen-tabs{display:flex;gap:10px;margin-top:30px}.pen-tabs button{border:1px solid #c8cec0;background:transparent;color:#78816f;border-radius:25px;padding:10px 20px;font-size:12px}.pen-tabs button.selected{color:#fff;background:#5b6e5d;border-color:#5b6e5d}.demo-label{display:block;font-size:9px;color:#969d8c;margin-top:15px;letter-spacing:1px}.paper-note{position:relative;min-height:410px;padding:40px;background:#faf7ec;transform:rotate(2deg);box-shadow:5px 15px 30px #56544013}.note-date{font-size:9px;letter-spacing:2px;color:#a0a08e}.note-text{font:32px/1.9 'Songti TC',serif;margin-top:40px;letter-spacing:5px}.paper-note svg{width:100%;height:130px;margin-top:-15px}.paper-note path{fill:none;stroke:#4a5141;stroke-width:9;stroke-linecap:round;opacity:.65;transition:stroke .4s,stroke-width .4s}.paper-note[data-pen=pen] path{stroke-width:2;opacity:1}.paper-note[data-pen=highlight] path{stroke-width:27;stroke:#b3bb60;opacity:.4}.note-bottom{font-size:10px;color:#959785;letter-spacing:1px}.night{background:#1c211e;color:#e4e6da;transition:background .7s,color .7s;position:relative}.night-copy{text-align:center}.night .eyebrow{color:#93a288}.night p{color:#9ba893}.theme-controls{display:flex;justify-content:center;gap:8px;margin:28px 0}.theme-controls button{border:1px solid #5a6656;background:transparent;border-radius:25px;padding:10px 22px;font-size:12px;color:#a8b59c}.theme-controls button.selected{background:#bec9b0;color:#232c23}.night-canvas{max-width:940px;margin:auto;border:1px solid #4c5849;border-radius:12px;padding:30px 40px;text-align:center;background:radial-gradient(#6b7d5f28 .6px,transparent .6px);background-size:18px 18px}.canvas-caption{display:block;text-align:left;font-size:11px;color:#9caa91}.canvas-caption span{font-size:9px;color:#738168}.night-quote{font:35px/1.8 'Songti TC',serif;letter-spacing:5px;margin:50px 0 36px}.night-connections{display:flex;justify-content:center;align-items:center;gap:0}.night-connections span{padding:13px 24px;border:1px solid #64755a;border-radius:30px;font-size:12px}.night-connections i{height:1px;width:55px;background:#657858}.night-foot{display:block;margin-top:45px;font-size:9px;letter-spacing:3px;color:#839377}.night.day{background:#e9ede3;color:#364532}.night.day p,.night.day .canvas-caption{color:#71836a}.night.day .night-canvas{background-color:#f7f8f0;border-color:#b4c1a8}.night.day .theme-controls button{color:#4a5c43}.section-title{display:flex;justify-content:space-between;align-items:center;margin-bottom:35px}.moment-tabs{display:flex;border-bottom:1px solid #d3d8ca}.moment-tabs button{flex:1;text-align:left;background:none;border:0;border-bottom:2px solid transparent;padding:20px 12px;font-size:14px;color:#919988}.moment-tabs button span{float:right;font-size:10px}.moment-tabs button[aria-selected=true]{border-color:#5b6e5d;color:#344530}.scenario{display:grid;grid-template-columns:1fr 1fr;gap:65px;align-items:center;padding:60px 25px;background:#eeefe7}.scenario h3{font:26px/1.6 'Songti TC',serif}.scenario-map{text-align:center}.scenario-map>b{font:20px 'Songti TC',serif;border:1px solid #b7c3a9;border-radius:25px;background:#e2e7d8;padding:15px 25px;display:inline-block}.scenario-map>div{display:flex;gap:10px;margin-top:45px;position:relative}.scenario-map>div:before{content:'';position:absolute;top:-22px;left:15%;right:15%;height:20px;border:1px solid #b4bea8;border-bottom:0}.scenario-map>div span{flex:1;font-size:11px;background:#f8f8f1;padding:16px 4px;border:1px solid #d7dccd;border-radius:5px}.keep{border-top:1px solid #daddd5}.keep-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:45px;margin-top:45px}.keep article>span{font-size:30px;color:#829174}.keep h3{font-size:16px;font-weight:450;margin-top:25px}.keep p{font-size:12px}.faq{display:grid;grid-template-columns:1fr 1.2fr;gap:80px;background:#eeede5}details{border-bottom:1px solid #d3d6c9}summary{list-style:none;padding:25px 0;font-size:14px;cursor:pointer;display:flex;justify-content:space-between;gap:15px}summary::-webkit-details-marker{display:none}summary span{color:#89967c}details[open] summary span{transform:rotate(45deg)}details p{font-size:12px;margin-top:0;padding-right:24px}.closing{text-align:center;padding:120px 20px;position:relative;overflow:hidden}.closing h2{font-size:clamp(34px,4vw,60px)}.closing-mark{position:absolute;right:4%;bottom:-30px;font:170px 'Songti TC',serif;color:#e7e9df;writing-mode:vertical-rl;z-index:-1}footer{display:flex;align-items:center;justify-content:space-between;gap:25px;border-top:1px solid #daddd5;padding:35px 5%;color:#818a76;font-size:11px}footer .brand{font-size:18px;color:#303a2b}footer small{font-size:9px}footer .brand img{width:35px}
@media(min-width:1500px){.hero{padding-top:95px}.preview{max-width:1180px}.hero-map{height:450px}}@media(max-width:850px){nav{gap:18px;font-size:11px}.hero-note{display:none}.hero{padding-top:60px}.hero-map{margin:0 40px;height:330px}.thought{width:130px;font-size:18px}.thought small{font-size:8px;letter-spacing:0}.thought.center{width:155px;font-size:22px}.touch-grid{gap:35px}.section-pad{padding:80px 6%}.paper-note{padding:25px}.note-text{font-size:26px}.scenario{gap:25px;padding:40px 20px}.keep-grid{gap:25px}.faq{gap:35px}.map-node{min-width:160px;padding:15px}.section-title p{font-size:12px}footer>span{display:none}}@media(max-width:600px){header{height:66px;padding:0 5%}.brand{font-size:19px;gap:7px}.brand img{width:31px;height:24px}nav{display:none}.small-cta{font-size:10px;padding:10px 14px}.small-cta span{margin-left:8px}.hero{padding:48px 5% 0}.eyebrow,.section-index{font-size:8px;letter-spacing:1.6px}.mobile-break{display:block}.hero h1{font-size:39px;letter-spacing:3px;margin-top:23px}.hero p{font-size:12px;letter-spacing:1px}.button{font-size:12px;padding:15px 22px;gap:28px}.hero>.button{margin-top:12px}.scroll-link{margin-top:20px}.preview{margin-top:33px;border-radius:8px}.app-bar{padding:0 12px;height:35px;font-size:8px}.app-bar i,.bar-right,.mini-tools{display:none!important}.app-bar img{width:20px}.hero-map{height:260px;margin:0 13px}.thought{width:95px;font-size:16px;padding:12px 6px}.thought small{font-size:7px;white-space:normal;line-height:1.5}.thought.center{width:120px;font-size:19px;padding:18px 4px}.handwriting{font-size:10px;left:33%;bottom:17px}.leaf-art{transform:scale(.6) rotate(30deg);top:0}.hero-bottom{font-size:8px;letter-spacing:.3px;margin-top:20px;padding-bottom:35px}.hero-bottom span:last-child{display:none}.flow-section{height:185vh}.flow-sticky{top:66px;height:calc(100svh - 66px);min-height:530px}.flow-heading h2{font-size:28px;letter-spacing:1px}.flow-heading p{font-size:11px}.living-map{height:300px;width:95%;min-height:0}.map-root{font-size:17px;padding:20px 12px;width:140px}.map-root span{font-size:8px}.map-node{min-width:0;width:124px;padding:13px 7px;font-size:13px}.map-node small{font-size:8px}.n1,.n3{left:20%}.n2,.n4{left:80%}.ink-underline{width:120px;left:35%}.flow-steps{gap:25px;font-size:9px}.flow-caption{font-size:8px;margin-top:20px}.section-pad{padding:65px 6%}h2{font-size:32px;letter-spacing:2px}.touch-grid{grid-template-columns:1fr;gap:35px;margin-top:25px}.touch p{font-size:12px}.paper-note{min-height:340px;padding:30px}.note-text{font-size:28px;margin-top:25px}.paper-note svg{height:105px}.night-canvas{padding:20px 15px}.canvas-caption{font-size:9px}.canvas-caption span{display:none}.night-quote{font-size:28px;letter-spacing:3px;margin:35px 0}.night-connections span{padding:11px 8px;font-size:9px}.night-connections i{width:15px}.section-title{display:block}.moment-tabs button{font-size:12px;padding:16px 4px}.moment-tabs button span{display:none}.scenario{grid-template-columns:1fr;gap:25px;padding:30px 20px}.scenario h3{font-size:22px}.scenario p{font-size:12px}.scenario-map{padding-bottom:10px}.keep-grid{grid-template-columns:1fr;gap:28px}.keep h2{margin-bottom:0}.keep-grid{margin-top:28px}.keep article{border-bottom:1px solid #dedfd4;padding-bottom:10px}.keep article>span{float:left;margin-right:17px}.keep h3{margin-top:10px;font-size:15px}.faq{grid-template-columns:1fr;gap:10px}.faq h2{margin-bottom:15px}summary{font-size:12px}.closing{padding:80px 20px}.closing h2{font-size:34px}.closing-mark{font-size:120px}footer{flex-wrap:wrap;padding:25px 5%;gap:20px}footer .brand{font-size:17px}footer small{order:3;width:100%}html{scroll-padding-top:66px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important;animation:none!important}.preview{transform:none!important}.flow-section{height:auto}.flow-sticky{position:relative;top:0;height:auto;min-height:0;padding:70px 0}.growing-line{stroke-dashoffset:0!important}.map-node{opacity:1!important;transform:translate(-50%,-50%)!important}.ink-underline{transform:rotate(-3deg) scaleX(1)!important}.flow-caption{display:none}}
@media(max-width:600px){.map-root{font-size:16px;width:150px;white-space:nowrap}.map-root span{white-space:normal}}
/* V2: real product snapshots; crisp DOM/SVG at every zoom level. */
.real-preview{max-width:1180px;border-radius:12px;overflow:hidden;transform:none;box-shadow:0 35px 70px -40px #34432e75}.product-fit{position:relative;width:100%;aspect-ratio:1.44;overflow:hidden;background:#f7f6f2}.product-fit iframe{position:absolute;left:0;top:0;width:1440px;height:1000px;border:0;transform-origin:0 0;pointer-events:none}.real-label{display:block;padding:13px;font-size:9px;letter-spacing:1.3px;text-align:center;color:#8a9380;border-top:1px solid #d9dece;background:#f4f4ed}.hero-bottom{max-width:1180px}.flow-section{height:480vh}.flow-sticky{height:calc(100svh - 84px);min-height:620px;gap:22px;padding:30px 0 18px;justify-content:center}.flow-heading{max-width:90%;flex-shrink:0}.flow-heading h2{font-size:clamp(30px,3.2vw,47px);margin:10px 0 5px}.flow-heading p{font-size:12px;letter-spacing:1px}.camera-viewport{position:relative;width:min(1120px,92vw);height:min(53vh,630px);min-height:270px;border-radius:13px;overflow:hidden;background:#f7f6f2;border:1px solid #cfd6c5;box-shadow:0 25px 65px -38px #46543c66;isolation:isolate}.camera-rig{position:absolute;width:1440px;height:1000px;top:50%;left:50%;transform:translate(-50%,-50%);transform-origin:center;will-change:transform}.camera-rig iframe{position:absolute;inset:0;width:1440px;height:1000px;border:0;pointer-events:none;background:#f7f6f2}#map-scene{opacity:0}.camera-scene-label{position:absolute;bottom:12px;left:17px;font-size:8px;letter-spacing:1px;padding:6px 9px;background:#f7f6f2e8;color:#8a9380;border-radius:4px}.camera-zoom{position:absolute;right:19px;bottom:15px;font-size:10px;letter-spacing:2px;color:#788769;background:#f7f6f2dd;padding:4px 7px}.focus-corners{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:60%;height:70%;opacity:0;pointer-events:none}.focus-corners i{position:absolute;width:18px;height:18px;border:1px solid #7a8b6180}.focus-corners i:nth-child(1){left:0;top:0;border-right:0;border-bottom:0}.focus-corners i:nth-child(2){right:0;top:0;border-left:0;border-bottom:0}.focus-corners i:nth-child(3){left:0;bottom:0;border-right:0;border-top:0}.focus-corners i:nth-child(4){right:0;bottom:0;border-left:0;border-top:0}.flow-controls{width:min(780px,90%);position:relative;flex-shrink:0}.flow-steps{justify-content:space-between;gap:12px}.flow-steps button{background:none;border:0;color:#9ba38f;font-size:10px;padding:8px 4px;letter-spacing:.5px;transition:color .2s}.flow-steps button.active{color:#3e5636}.chapter-progress{height:1px;background:#d8dece;margin-top:9px}.chapter-progress span{display:block;width:0;height:2px;background:#6d805b}.skip-story{display:block;text-align:center;color:#8b957d;font-size:9px;letter-spacing:1px;margin-top:13px}.actual-ink{padding:0;transform:rotate(1deg);min-height:0;border:1px solid #d7dece;overflow:hidden;border-radius:5px;background:#f7f6f2}.detail-window{height:340px;position:relative;overflow:hidden}.detail-window iframe{width:1440px;height:1000px;position:absolute;left:50%;top:50%;border:0;transform-origin:center;pointer-events:none}.detail-label{padding:18px 24px;border-top:1px solid #d7dece;font-size:12px;color:#67775b;background:#f0f2e9}.detail-label small{display:block;font-size:9px;margin-top:8px;letter-spacing:1px;color:#8b957e}.real-night{padding:0;max-width:960px;overflow:hidden}.real-night .product-fit{background:#191b1a}.theme-night{opacity:1;transition:opacity .65s}.night.day .theme-night{opacity:0}.real-night .real-label{background:#242b22;border-color:#45543c;color:#a2b193}.night.day .real-label{background:#f0f4e9;color:#697d5e}.real-preview .product-fit{max-height:none}.hero>.button{margin-top:13px}.hero{padding-top:65px}.hero h1{margin-bottom:12px}.hero-note{top:190px}.hero .preview{margin-top:35px}
@media(max-width:600px){.hero{padding-top:45px}.real-preview{width:calc(100% + 14px);margin-left:-7px!important;margin-right:-7px!important;border-radius:7px}.real-label{font-size:7px;padding:9px;letter-spacing:.6px}.flow-section{height:400svh}.flow-sticky{top:66px;min-height:520px;height:calc(100svh - 66px);padding:20px 0 15px;gap:20px}.flow-heading h2{font-size:27px;letter-spacing:1px}.flow-heading p{font-size:10px;letter-spacing:.3px;max-width:320px}.camera-viewport{height:43svh;min-height:230px;width:94%;border-radius:8px}.flow-steps{gap:0}.flow-steps button{font-size:8px;letter-spacing:0;padding:10px 2px;max-width:60px;line-height:1.7}.camera-scene-label{font-size:6px;left:8px;bottom:8px;letter-spacing:0}.camera-zoom{font-size:8px;right:8px;bottom:7px}.detail-window{height:280px}.detail-label{font-size:11px;padding:15px 20px}.real-night .product-fit{aspect-ratio:1.25}.hero-note{display:none}.real-night{margin-left:-10px;margin-right:-10px}.hero-bottom{padding-bottom:40px}.real-preview .product-fit{aspect-ratio:1.3}}
@media(prefers-reduced-motion:reduce){.flow-section{height:auto!important}.flow-sticky{position:relative;height:auto;min-height:0;top:0;padding:65px 0 40px}.flow-controls{display:none}.camera-rig{will-change:auto}.focus-corners{display:none}.camera-viewport{height:min(65vw,560px);min-height:240px}#tutorial-scene{opacity:0!important}#map-scene{opacity:1!important}}
.flow-heading h2{text-wrap:balance}
@media(max-width:600px){.flow-heading h2{max-width:315px;font-size:25px;line-height:1.5;margin-left:auto;margin-right:auto}}
@media(max-height:650px) and (prefers-reduced-motion:no-preference){.flow-sticky{min-height:0;gap:10px;padding:12px 0}.flow-heading h2{font-size:24px;margin:5px 0}.flow-heading p{font-size:10px}.camera-viewport{height:45svh;min-height:150px}.flow-steps button{padding:4px 2px}.skip-story{margin-top:7px}}
/* Four-language website copy, isolated from the product and template work. */
.language-switcher{display:flex;align-items:center;gap:3px}.language-switcher button{background:none;border:1px solid transparent;border-radius:20px;color:#7c8675;font-size:10px;padding:8px 9px;white-space:nowrap}.language-switcher button[aria-pressed=true]{border-color:#b3c0a5;color:#3e5636;background:#e9eee1}.language-switcher button:hover{background:#ecefe5}header{gap:18px}header nav{gap:22px}.hero h1,.hero>p,.hero-note,.touch h2,.touch p,.night h2,.night p,.section-title h2,.section-title p,.closing h2{white-space:pre-line}.hero h1{font-size:clamp(36px,4.5vw,68px);line-height:1.25;letter-spacing:2px}.hero>p{max-width:740px;margin-left:auto;margin-right:auto;letter-spacing:.5px}.hero-note{top:235px;font-size:11px;max-width:175px}.hero>.eyebrow{letter-spacing:2px}.flow-heading{max-width:88%}.flow-heading h2{max-width:850px;font-size:clamp(26px,3vw,43px)}.flow-heading p{max-width:720px;margin:auto}.flow-steps button{white-space:nowrap}.faq summary:after{content:'＋';color:#89967c;flex-shrink:0}.faq details[open] summary:after{content:'−'}.closing-mark{display:none}html:lang(en) .hero h1,html:lang(en) h2{font-family:Georgia,'Times New Roman',serif;letter-spacing:-1px}html:lang(en) header .brand{font-size:20px}html:lang(en) header nav{font-size:11px;gap:18px}html:lang(ko) h1,html:lang(ko) h2,html:lang(ko) p{word-break:keep-all;overflow-wrap:break-word}html:lang(ja) h1,html:lang(ja) h2{font-family:'Hiragino Mincho ProN','Yu Mincho',serif}html:lang(ko) h1,html:lang(ko) h2{font-family:'AppleMyungjo','Batang',serif}.real-label{white-space:normal;line-height:1.6}.scenario>*{min-width:0}.scenario-map>div span{overflow-wrap:anywhere}.section-title>p{max-width:430px}.flow-heading p{line-height:1.7}.keep h3{line-height:1.6}
@media(max-width:1150px){.hero-note{display:none}header{flex-wrap:wrap;height:110px;padding-top:12px;padding-bottom:8px;gap:8px}header nav{margin-left:auto;margin-right:15px}.language-switcher{width:100%;justify-content:flex-end}.flow-sticky{top:110px;height:calc(100svh - 110px)}html{scroll-padding-top:110px}}
@media(max-width:600px){header{height:106px;gap:5px;padding:11px 5% 8px}.language-switcher{justify-content:center;gap:9px}.language-switcher button{font-size:10px;padding:5px 9px;min-height:30px}.small-cta{margin-left:auto;max-width:49%;text-align:center}.brand{font-size:18px!important}.hero h1{font-size:35px;letter-spacing:1px}.hero>p{font-size:12px;line-height:1.9}.hero{padding-top:38px}.flow-sticky{top:106px;height:calc(100svh - 106px);gap:14px}.flow-heading h2{font-size:24px;max-width:330px}.flow-heading p{font-size:10px;max-width:330px;min-height:35px}.flow-steps button{font-size:8px;max-width:none;white-space:normal;min-width:0}.camera-viewport{height:39svh;min-height:210px}.section-title>p{max-width:100%}html{scroll-padding-top:106px}.closing h2{font-size:31px}html:lang(en) .hero h1{font-size:37px}html:lang(ko) .hero h1{font-size:30px}html:lang(en) h2{font-size:31px}html:lang(en) .flow-heading h2{font-size:24px}.moment-tabs button{line-height:1.6;padding:14px 5px}.scenario-map>div span{font-size:10px}.camera-scene-label{max-width:75%;font-size:6px}.night .eyebrow,.moments .section-index{line-height:1.7}.hero-bottom{line-height:1.8}}
@media(prefers-reduced-motion:reduce){.flow-sticky{top:0;height:auto}}
@media(max-width:600px){html:lang(ja) .hero h1{font-size:29px;letter-spacing:.2px}html:lang(ko) .hero h1{font-size:28px;letter-spacing:0}.hero h1{text-wrap:balance}}

.features{background:#eeeee7}.features>p{max-width:680px;line-height:1.9;color:var(--muted)}.feature-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:40px;margin-top:48px}.feature-grid article{border-top:1px solid #bac1b5;padding-top:24px}.feature-icon{font-size:30px;color:#5b6e5d}.feature-grid h3{font-size:20px;line-height:1.6;margin:20px 0 14px}.feature-grid p,.feedback p{font-size:15px;line-height:1.9;color:#657064}.feature-grid small{display:block;line-height:1.8;color:#657064;margin-top:20px}.feedback{display:grid;grid-template-columns:1.6fr 1fr;gap:70px;background:#e9ede5}.feedback h2{font-size:38px;line-height:1.5}.feedback-help{max-width:650px}.feedback-action{align-self:center}.feedback-action .button:disabled{cursor:not-allowed;opacity:.55}.feedback-action p{max-width:330px;font-size:13px}.feedback button{font:inherit;border:0}.feature-grid>*{min-width:0}@media(max-width:850px){.feature-grid{grid-template-columns:1fr;gap:25px}.feedback{grid-template-columns:1fr;gap:24px}.feedback h2{font-size:29px}.feature-grid h3{font-size:19px}}
/* Product-state stories: all scenes are frozen captures of real operations. */
.operation-story{height:380svh;position:relative;background:#f5f4ef}.operation-story[data-story=collab]{height:430svh;background:#ecefe8}.operation-sticky{position:sticky;top:88px;height:calc(100svh - 88px);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:20px;padding:28px 5%}.operation-heading{text-align:center;max-width:800px}.operation-heading h2{font-size:35px;line-height:1.5;margin:12px 0}.operation-heading p{font-size:14px;line-height:1.8;color:#687363;min-height:48px;margin:0}.operation-window{width:min(1080px,100%);height:55svh;min-height:260px;position:relative;overflow:hidden;border:1px solid #d2d7cb;border-radius:18px;background:#f7f6f2;box-shadow:0 25px 65px #27352c08}.operation-layer{position:absolute;inset:0;opacity:0;pointer-events:none;transition:opacity .45s ease}.operation-layer iframe,.sync-view iframe{position:absolute;left:50%;top:50%;width:1440px;height:1000px;border:0;transform-origin:center;pointer-events:none;max-width:none}.operation-controls{display:flex;gap:28px;justify-content:center;width:100%}.operation-controls button{border:0;border-bottom:1px solid transparent;background:none;padding:10px 8px;color:#89917f;font:inherit;font-size:12px;cursor:pointer}.operation-controls button.active{color:#455c45;border-color:#5b6e5d}.operation-progress{height:1px;background:#d9dfd1;width:min(680px,90%)}.operation-progress span{height:100%;display:block;background:#5b6e5d}.operation-note{font-size:10px;line-height:1.5;color:#828b78;text-align:center}.sync-pair{position:absolute;inset:0;display:grid;grid-template-columns:1fr 1fr;gap:20px;padding:25px;background:#f2f4ed;pointer-events:none}.sync-pair>div{display:flex;flex-direction:column;gap:18px;min-width:0}.sync-pair>div>span{font-size:13px;color:#53654d}.sync-view{position:relative;flex:1;overflow:hidden;border:1px solid #d6dccf;border-radius:12px;background:#f7f6f2}.scenario{grid-template-columns:1fr!important;gap:24px!important}.scenario>div:first-child{max-width:720px}.scenario-preview{height:540px;width:100%;border:1px solid #d5dbce;border-radius:12px;overflow:hidden;position:relative;background:#f7f6f2}.scenario-preview iframe{transition:opacity .3s}.scenario-preview iframe:not([data-template=work]){opacity:0}.operation-controls button:focus-visible{outline:2px solid #5b6e5d;outline-offset:3px}
@media(max-width:1150px){.operation-sticky{top:110px;height:calc(100svh - 110px)}}
@media(max-width:600px){.operation-sticky{top:106px;height:calc(100svh - 106px);padding:16px 5%;gap:14px}.operation-heading h2{font-size:25px!important;margin:8px 0}.operation-heading p{font-size:12px;min-height:65px}.operation-window{height:40svh;min-height:245px}.operation-controls{gap:5px}.operation-controls button{font-size:10px;line-height:1.5;padding:7px 5px;flex:1}.operation-note{font-size:9px}.sync-pair{grid-template-columns:1fr;gap:12px;padding:12px}.sync-pair>div{gap:5px}.sync-pair>div>span{font-size:10px}.scenario-preview{height:320px}.scenario{padding:20px!important}.operation-story{height:340svh}.operation-story[data-story=collab]{height:400svh}}
@media(prefers-reduced-motion:reduce){.operation-story,.operation-story[data-story=collab]{height:auto}.operation-sticky{position:relative;top:0;height:auto;padding-top:60px;padding-bottom:60px}.operation-layer,.scenario-preview iframe{transition:none}}

.story-link{display:inline-block;color:#52694e;margin-top:22px;font-size:13px;text-underline-offset:5px}
/* V6: centred chapters and deliberate collaboration playback. */
.flow-section{height:540svh}.flow-heading,.flow-heading h2,.flow-heading p,.operation-heading,.operation-heading h2,.operation-heading p{margin-left:auto;margin-right:auto;text-align:center}.flow-heading,.operation-heading{width:min(800px,90%)}.flow-heading p{max-width:680px}.operation-story[data-story=collab]{height:590svh}.operation-sticky{gap:14px}.operation-heading h2{margin:6px auto}.operation-heading p{min-height:0}.operation-window{flex:1;min-height:240px;max-height:58svh;width:min(1120px,100%);margin-inline:auto}.operation-controls{flex-shrink:0}.replay-controls{display:flex;gap:18px;justify-content:center;min-height:32px}.replay-controls[hidden]{display:none}.replay-controls button{border:1px solid #bcc7b5;background:transparent;border-radius:30px;color:#52634c;padding:6px 16px;font:inherit;font-size:11px;cursor:pointer}.replay-controls button:disabled{opacity:.4;cursor:default}.sync-pair{grid-template-rows:1fr auto;padding:20px;gap:12px 20px}.sync-pair>div>span{text-align:center;line-height:1.5}.sync-status{grid-column:1/-1;text-align:center;color:#5c7054;font-size:12px;min-height:20px;display:block!important}.scenario>div:first-child{margin-inline:auto;text-align:center}.scenario-preview{margin-inline:auto}.hero .preview,.real-night{margin-inline:auto}.feature-grid article .story-link{display:inline-block}.operation-layer iframe{transform-origin:center}.flow-steps button{flex:1}.closing>.transition-preview{display:block;margin:22px auto 0;background:none;border:0;border-bottom:1px solid #aab69f;padding:6px;color:#68785a;font:inherit;font-size:12px;cursor:pointer}
@media(max-width:600px){.flow-section{height:480svh}.operation-story[data-story=collab]{height:540svh}.operation-sticky{gap:10px}.operation-heading{width:100%}.operation-heading h2{font-size:24px!important}.operation-heading p{min-height:0}.operation-window{min-height:270px;max-height:44svh}.sync-pair{grid-template-rows:1fr 1fr auto;padding:10px}.sync-status{font-size:10px;min-height:15px}.flow-heading h2,.flow-heading p{margin-inline:auto}.operation-controls button{padding:4px}.operation-note{max-width:290px;margin-inline:auto}}
@media(max-height:700px) and (min-width:601px){.operation-sticky{padding:12px 5%;gap:7px}.operation-heading h2{font-size:26px}.operation-heading p{font-size:12px}.operation-window{min-height:170px}.operation-heading .section-index{font-size:8px}.operation-controls button{padding:4px}.replay-controls{min-height:25px}.operation-note{font-size:9px}}
@media(prefers-reduced-motion:reduce){.operation-story[data-story=collab]{height:auto}.operation-window{height:480px;flex:none}.flow-section{height:auto}}
#canvas-transition{position:fixed;inset:0;z-index:10000;display:grid;place-items:center;overflow:hidden;isolation:isolate;background:#f7f6f2e8;opacity:0;transition:opacity .32s ease;backdrop-filter:blur(8px)}#canvas-transition[hidden]{display:none}#canvas-transition:before{content:"";position:absolute;width:160vmax;height:160vmax;border-radius:50%;background:radial-gradient(ellipse at 48% 42%,#fffefa,#f2f1e9 50%,#dbe1d4);transform:translateY(60%) scale(.12);transition:transform 1.15s cubic-bezier(.22,.65,.25,1);z-index:-1}#canvas-transition.entering{opacity:1}#canvas-transition.entering:before{transform:translateY(0) scale(1)}.transition-brand{text-align:center;color:#4d634d;opacity:0;transform:translateY(14px);transition:opacity .6s .2s,transform .8s .15s}.entering .transition-brand{opacity:1;transform:none}.transition-brand img{width:86px;display:block;margin:0 auto 24px;mix-blend-mode:multiply}.transition-brand strong{font-size:24px;font-weight:400;letter-spacing:3px}.transition-brand p{font-size:13px;margin-top:22px;letter-spacing:2px}body.transitioning{overflow:hidden}@media(prefers-reduced-motion:reduce){#canvas-transition,#canvas-transition:before,.transition-brand{transition:none!important}}

.footer-links{display:flex;flex-wrap:wrap;justify-content:center;gap:14px 24px;font-size:12px}.footer-links a,.support-email{color:#52634c;text-underline-offset:4px}.support-email{font-size:14px;overflow-wrap:anywhere}.feedback-action .button{display:inline-flex;justify-content:center}

/* V8: award-direction audit — legibility, language rhythm and mobile control. */
:root{--muted:#586451;--header-height:84px}
p,.hero p,.keep p,.touch p,.scenario p,details p{color:#586451}.eyebrow,.section-index,.real-label,.demo-label,.detail-label small,.hero-bottom,.scroll-link,.skip-story,.operation-note{color:#596651}.flow-steps button,.operation-controls button{color:#5c6856}.flow-steps button.active,.operation-controls button.active{color:#293e2c;font-weight:600}.language-switcher button{color:#4e5d49}.mobile-menu{display:none}h1,h2,h3{text-wrap:balance}p{text-wrap:pretty}.feature-grid h3{font-weight:500}.night p{color:#bcc7b6}.night .eyebrow{color:#b6c4ab}footer{flex-wrap:wrap}.footer-links a{display:inline-flex;align-items:center;min-height:44px}.footer-links{margin-left:auto}header .brand{white-space:nowrap}.flow-steps button,.operation-controls button,.replay-controls button,.pen-tabs button,.theme-controls button{min-height:44px}.skip-story,.scroll-link{min-height:44px;display:flex;align-items:center;justify-content:center}.story-link{min-height:44px;align-content:center}.language-switcher button{min-height:40px}.sync-pair>div{min-height:0}.sync-view{min-height:0}.operation-heading{flex-shrink:0}
@media(max-width:1150px){:root{--header-height:116px}header{height:var(--header-height)}.flow-sticky,.operation-sticky{top:var(--header-height);height:calc(100svh - var(--header-height))}html{scroll-padding-top:var(--header-height)}}
@media(max-width:600px){
 :root{--header-height:120px}header{gap:4px;padding:8px 4%;align-content:center}.brand{font-size:17px!important;gap:5px}.brand img{width:27px}.small-cta{min-height:44px;max-width:35%;display:flex;align-items:center;justify-content:center;padding:8px 12px;font-size:11px;margin-left:0}.language-switcher{gap:5px;justify-content:space-between}.language-switcher button{min-height:44px;font-size:12px;flex:1;padding:7px 5px}.mobile-menu{display:block;position:static;border:0;margin-left:auto}.mobile-menu summary{font:12px Inter,sans-serif;min-height:44px;min-width:44px;padding:10px 4px;align-items:center;justify-content:center;color:#455b43}.mobile-menu>div{position:absolute;top:100%;left:0;right:0;padding:12px 6% 20px;background:#f7f6f2;box-shadow:0 14px 25px #293c241a;border-bottom:1px solid #d0d8c9;display:grid;grid-template-columns:1fr 1fr;gap:8px}.mobile-menu a{min-height:48px;display:flex;align-items:center;font-size:14px}
 .hero{padding-top:44px}.hero>p,.touch p,.scenario p,.keep p,details p,.section-title p{font-size:15px;line-height:1.85;letter-spacing:0}.eyebrow,.section-index{font-size:10px;line-height:1.6;letter-spacing:1.5px}.real-label,.detail-label small,.demo-label,.hero-bottom{font-size:11px;letter-spacing:.3px}.flow-sticky{min-height:0;padding:16px 0 10px;gap:10px}.flow-heading{max-width:90%;width:90%}.flow-heading h2{font-size:26px;line-height:1.3;margin:8px auto}.flow-heading p{font-size:13px;line-height:1.6;min-height:0;letter-spacing:0}.camera-viewport{flex:1;height:auto;min-height:160px;max-height:42svh;width:92%}.flow-controls{width:92%}.flow-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:0 6px}.flow-steps button{font-size:12px;min-height:40px;padding:6px 4px;border-radius:5px}.flow-steps button.active{background:#e6ecdf}.chapter-progress{margin-top:5px}.skip-story{font-size:12px;margin-top:4px}.camera-scene-label{font-size:9px;max-width:78%;left:5px;bottom:5px;letter-spacing:0}.camera-zoom{font-size:9px;right:5px;bottom:7px}
 .operation-sticky{padding:14px 4%;gap:8px}.operation-heading h2{font-size:24px!important;line-height:1.3;margin:7px auto}.operation-heading p{font-size:13px;line-height:1.6}.operation-window{min-height:180px;max-height:42svh;flex:1}.operation-controls{display:grid;grid-template-columns:repeat(4,1fr);gap:3px}.operation-controls button{font-size:11px;line-height:1.3;min-height:44px}.replay-controls button{font-size:12px}.operation-note{font-size:10px;line-height:1.5;max-width:100%}.sync-status{font-size:11px}.sync-pair>div>span{font-size:11px}.sync-pair{gap:8px;padding:8px}.scenario-preview{height:auto;aspect-ratio:1.15}.moment-tabs button{font-size:13px;min-height:52px}.pen-tabs button,.theme-controls button{font-size:13px}.feature-grid{margin-top:28px}.feature-grid small{font-size:12px}.feedback-action p{font-size:14px}.support-email{display:inline-flex;align-items:center;min-height:44px}.closing>.transition-preview{min-height:44px;font-size:13px}.footer-links{width:100%;margin:0;justify-content:flex-start;gap:4px 20px}footer>a:last-child{min-height:44px;display:flex;align-items:center}footer small{font-size:11px}.section-pad{padding:64px 6%}html:lang(en) .operation-heading h2{letter-spacing:-.5px}html:lang(ja) h2{letter-spacing:.5px}html:lang(ko) h2{letter-spacing:0}
}
/* Short screens use the same scenes with explicit chapter controls, so content is never clipped. */
@media(max-height:700px) and (max-width:600px),(max-height:500px){.flow-section,.operation-story[data-story=collab]{height:auto}.flow-sticky,.operation-sticky{position:relative;top:0;height:auto;min-height:0;padding-top:32px;padding-bottom:32px;overflow:visible}.camera-viewport{flex:none;height:290px;max-height:none}.operation-window{flex:none;height:340px;max-height:none}.flow-heading,.operation-heading{min-height:0}.flow-section .flow-controls{display:block}.operation-heading{width:92%}}
@media(prefers-reduced-motion:reduce){.flow-sticky,.operation-sticky{position:relative;top:0;height:auto}.operation-window{flex:none;height:360px;max-height:none}.camera-viewport{flex:none;height:320px;max-height:none}}
/* Desktop audit: readable navigation, consistent section rhythm, short-window fit. */
@media(min-width:601px){
 header nav,html:lang(en) header nav{font-size:13px;gap:20px}.language-switcher button{font-size:12px}.small-cta{font-size:13px}.hero-note{color:#5e6c55;letter-spacing:1px}.flow-heading p{font-size:14px}.flow-steps button{font-size:12px}.skip-story{font-size:12px}.camera-scene-label{font-size:10px}.real-label,.hero-bottom,.detail-label small,.demo-label{font-size:12px;letter-spacing:.5px}.keep p,details p{font-size:14px}.operation-note{font-size:12px}.replay-controls button{font-size:13px}.section-title{gap:48px}.section-title>h2{flex:1;min-width:0}.section-title>p{flex:1;max-width:430px}.feature-grid h3{min-height:3.2em}.footer-links{font-size:13px}footer small{font-size:11px}
}
@media(min-width:601px) and (max-height:760px){
 .flow-sticky{min-height:0;padding:14px 0;gap:10px}.flow-heading h2{font-size:30px;line-height:1.3;margin:5px 0}.flow-heading p{font-size:13px;line-height:1.5}.camera-viewport{flex:1;height:auto;min-height:130px;max-height:48svh}.flow-steps button{min-height:40px}.skip-story{min-height:36px;margin-top:3px}.chapter-progress{margin-top:3px}.operation-sticky{padding:14px 5%;gap:8px}.operation-heading h2{font-size:28px;line-height:1.3}.operation-heading p{font-size:13px;line-height:1.5}.operation-window{min-height:140px}.operation-note{font-size:11px}.replay-controls button{min-height:36px}.operation-controls button{min-height:40px}
}
@media(prefers-reduced-motion:reduce){.flow-sticky,.operation-sticky{height:auto}.camera-viewport{flex:none;height:400px;max-height:none}}