:root{--paper:#f6f2e9;--paper-2:#fffaf1;--ink:#172536;--ink-muted:#687383;--verm:#c45642;--verm-dark:#9e3f34;--line:#ded8cf;--azure:#3978cf;--midnight:#243a54;--shadow:0 24px 50px rgba(35,44,55,.12);--serif:'Noto Serif CJK JP','Yu Mincho','Hiragino Mincho ProN',serif;--sans:'Noto Sans CJK JP','Hiragino Kaku Gothic ProN',Meiryo,sans-serif}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);-webkit-font-smoothing:antialiased;min-height:100vh;overflow-x:hidden}body::before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.15;background-image:radial-gradient(#9d8f7c .7px,transparent .7px);background-size:7px 7px;z-index:-1}button,select{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.45}button:focus-visible,select:focus-visible{outline:3px solid #2e76c9;outline-offset:4px}button:active{transform:translateY(2px)}.ambient-stamp{position:absolute;top:100px;right:-80px;font:700 390px var(--serif);color:#c7b9a4;opacity:.095;pointer-events:none;user-select:none;z-index:-1}.app-shell{width:min(1376px,calc(100% - 96px));margin:0 auto}.global-header{height:108px;display:flex;align-items:center;gap:32px;border-bottom:1px solid rgba(108,103,99,.16)}.brand{display:flex;align-items:center;gap:12px;flex:0 0 auto}.brand-seal{position:relative;background:var(--verm);color:white;width:48px;height:48px;border-radius:12px;display:grid;place-items:center;font-family:var(--serif);font-size:28px;font-weight:800;box-shadow:inset 0 -4px 0 #913b31,0 5px 12px rgba(149,50,32,.15);transform:rotate(-6deg)}.brand-seal .seal-line{position:absolute;inset:5px;border:1px solid rgba(255,255,255,.4);border-radius:7px;transform:rotate(4deg)}.brand-name{display:flex;flex-direction:column;line-height:1.1;gap:8px}.brand-jp{font-size:20px;letter-spacing:.03em;font-weight:900}.brand-en{font-size:9px;letter-spacing:.17em;font-weight:800}.mini-red{color:var(--verm);letter-spacing:.08em}.desktop-nav{margin:auto;display:flex;align-items:stretch;gap:38px;height:100%}.nav-link{position:relative;border:0;background:transparent;color:#7a8290;font-size:13px;font-weight:800;padding:0 2px}.nav-link.active{color:var(--ink)}.nav-link.active::after{position:absolute;content:"";width:22px;height:3px;background:var(--verm);left:50%;bottom:29px;transform:translateX(-50%);border-radius:3px}.header-actions{display:flex;align-items:center;gap:14px}.save-status{display:flex;align-items:center;gap:7px;font-size:11px;color:#7e897d;white-space:nowrap}.signal-dot{width:6px;height:6px;border-radius:50%;background:#71aa7e;box-shadow:0 0 0 3px #71aa7e21}.header-icon{border:0;background:transparent;color:#5e6876;width:30px;height:34px;display:grid;place-items:center}.header-icon svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linejoin:round;stroke-linecap:round}.header-icon.is-muted{opacity:.45}.account-button{display:flex;align-items:center;gap:9px;border:1px solid #dad6cc;background:rgba(255,255,255,.5);border-radius:30px;padding:5px 12px 5px 6px;font-size:12px;color:var(--ink);font-weight:800}.account-avatar{width:27px;height:27px;border-radius:50%;display:grid;place-items:center;background:#e5e4df;color:#56667b;font-family:var(--serif);font-size:14px}.page-home{position:relative}.hero{display:grid;grid-template-columns:40% 60%;padding-top:36px;min-height:552px;align-items:center}.hero-copy{z-index:2;padding:10px 0 40px 16px}.eyebrow,.section-kicker{display:flex;align-items:center;gap:10px;font-size:11px;letter-spacing:.15em;color:var(--verm);font-weight:800}.eyebrow-line{height:1px;width:30px;background:var(--verm)}.hero-copy h1{font-size:clamp(41px,4.1vw,66px);line-height:1.27;letter-spacing:-.07em;font-weight:900;margin:28px 0 20px;font-family:var(--serif)}.hero-copy h1 em{color:var(--verm);font-style:normal;position:relative}.hero-copy h1 em::after{content:"";height:7px;width:84%;position:absolute;left:6%;bottom:-10px;background:rgba(199,91,62,.17);border-radius:50%}.hero-lead{font-size:15px;line-height:2.05;color:#6b7581;margin:0 0 30px;letter-spacing:.03em}.hero-buttons{display:flex;align-items:center;gap:12px}.button{border:0;border-radius:14px;height:58px;display:flex;gap:13px;align-items:center;justify-content:center;font-size:14px;font-weight:900;white-space:nowrap;transition:filter .18s,transform .16s,box-shadow .16s}.button:hover{filter:brightness(1.035)}.button-primary{padding:0 21px;color:white;background:var(--verm);box-shadow:0 5px 0 var(--verm-dark),0 14px 25px #c4564228;min-width:207px}.button-primary:active{box-shadow:0 2px 0 var(--verm-dark),0 8px 17px #c4564233}.button-icon-round{background:rgba(255,255,255,.19);width:27px;height:27px;border-radius:50%;display:grid;place-items:center;font-size:10px;padding-left:2px}.button-arrow{font-size:20px;margin-left:auto;font-weight:500}.button-outline{padding:0 21px;border:1px solid #c7c5be;background:rgba(255,255,255,.36);color:#303f4e;min-width:163px;justify-content:space-between}.resume-info,.first-time-hint{display:flex;gap:10px;align-items:center;margin-top:25px;font-size:11px;color:#858b95}.resume-info strong{color:#516274;font-weight:800}.resume-pip{width:6px;height:6px;border-radius:50%;background:#c5875d}.resume-separator{color:#c5b7a7}.tiny-cross{color:var(--verm);font-size:16px}.showcase{height:514px;position:relative;isolation:isolate;min-width:0}.showcase::before{content:"";position:absolute;inset:10% 1% 0 2%;background:radial-gradient(ellipse at 55% 45%,#fdfcf6 3%,#dce7e9 57%,#e2e5df 90%);border-radius:52% 48% 46% 53%;filter:drop-shadow(0 35px 40px rgba(51,68,78,.09));z-index:-1}.showcase::after{content:"";position:absolute;inset:17% 7% 7% 13%;background-image:linear-gradient(rgba(85,104,115,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(85,104,115,.045) 1px,transparent 1px);background-size:24px 24px;mask-image:radial-gradient(ellipse,black 15%,transparent 68%);pointer-events:none;z-index:-1}.showcase canvas{position:absolute;inset:0;width:100%;height:100%;cursor:pointer;touch-action:pan-y}.showcase-corner{position:absolute;color:#7e8690;z-index:2;font-size:10px;letter-spacing:.1em;font-weight:800;pointer-events:none}.showcase-corner.top-left{top:54px;left:55px;color:#c65c4b}.showcase-corner.top-left span{color:#778d98;margin-left:8px;font-size:9px}.showcase-corner.top-right{top:54px;right:34px;display:flex;align-items:center;gap:7px;color:#66828d;font-size:9px}.live-pulse{height:6px;width:6px;border-radius:50%;background:#5aa98a;box-shadow:0 0 0 4px #5aa98a19}.showcase-label{z-index:2;position:absolute;display:flex;align-items:center;gap:7px;font-size:11px;font-weight:800;color:#6b7686;pointer-events:none}.showcase-label strong{font-family:var(--serif);font-size:19px}.left-glyph{left:65px;top:185px}.left-glyph strong{color:#3374bd}.right-glyph{right:43px;top:215px}.right-glyph strong{color:#bf624c}.label-dot{display:inline-block;width:7px;height:7px;border-radius:50%}.label-dot.blue{background:#3d84cf}.label-dot.red{background:#c8614c}.showcase-caption{position:absolute;bottom:57px;left:0;right:0;text-align:center;color:#6e858f;font-size:11px;letter-spacing:.04em;pointer-events:none}.caption-cross{color:var(--verm);font-size:17px;margin-right:6px}.preview-picker{position:absolute;bottom:7px;left:50%;transform:translateX(-50%);display:flex;gap:8px;padding:5px;border-radius:99px;background:#fdfcf4d9;border:1px solid #d5ddd7;box-shadow:0 5px 16px #334b5814;z-index:3}.glyph-chip,.glyph-chip-random{border:0;background:transparent;width:33px;height:33px;border-radius:50%;font-family:var(--serif);font-size:17px;color:#6b7782}.glyph-chip.is-current{background:var(--midnight);color:white;box-shadow:0 3px 6px #243a5435}.glyph-chip-random{font-size:19px;border-left:1px solid #e0ddd5;border-radius:0 50% 50% 0;margin-left:2px}.bottom-content{padding:38px 16px 0}.section-topline{display:flex;align-items:end;justify-content:space-between;margin-bottom:23px}.section-kicker{font-size:10px;letter-spacing:.17em}.section-topline h2{margin:8px 0 0;font-size:26px;font-weight:900;letter-spacing:-.04em}.text-arrow{border:0;background:transparent;color:#677789;font-weight:800;font-size:12px}.mode-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:15px}.mode-card{height:222px;overflow:hidden;border:1px solid #dfdfda;border-radius:19px;background:#fbfaf5;text-align:left;position:relative;padding:17px 20px 20px;box-shadow:0 7px 13px rgba(70,79,87,.04);transition:transform .22s,box-shadow .22s,border-color .22s}.mode-card:hover{transform:translateY(-4px);box-shadow:0 18px 28px rgba(70,79,87,.11);border-color:#c8bbae}.mode-card:active{transform:translateY(-1px)}.mode-card::after{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle at 75% 30%,#ffffff90,transparent 55%)}.mode-card--story{background:linear-gradient(135deg,#f5eade,#fffaf3)}.mode-card--streak{background:linear-gradient(135deg,#e3eaf0,#f9fbfb)}.mode-card--scout{background:linear-gradient(135deg,#e7e9df,#fcfcf7)}.mode-card--quick{background:linear-gradient(135deg,#efebe9,#fbf8f7)}.mode-top{position:relative;z-index:2;display:flex;justify-content:space-between;align-items:center}.mode-number{font-size:9px;letter-spacing:.12em;font-weight:800;color:#8e8782}.mode-tag{color:#c05c46;border:1px solid #c05c4651;padding:3px 7px;border-radius:20px;font-size:9px;font-weight:800}.mode-art{position:absolute;inset:6px 3px 53px 0;display:grid;place-items:center}.art-ring{width:148px;height:62px;border:3px solid #bfc9ca;box-shadow:0 6px 0 #c6cbc780,0 10px 15px #6a8a9530,inset 0 6px 12px #b9c6c633;border-radius:50%;transform:translate(42px,14px) rotate(-8deg)}.art-symbol{position:absolute;left:53%;top:30%;transform:translate(-50%,-50%) rotate(-8deg);font-size:75px;font-weight:900;font-family:var(--serif);color:#c2644d;text-shadow:2px 3px #884936,4px 6px #d2aaa0,8px 12px 13px #9f5b4545}.mode-card--streak .art-symbol{color:#4c719a;text-shadow:2px 3px #2e506d,4px 6px #adbdce,8px 12px 13px #33587750}.mode-card--scout .art-symbol{color:#748d63;text-shadow:2px 3px #547045,4px 6px #c8d1bf,8px 12px 13px #40613945}.mode-card--quick .art-symbol{color:#8d647d;text-shadow:2px 3px #67405d,4px 6px #d1b9c8,8px 12px 13px #74455f45}.mode-pattern{position:absolute;font-family:var(--serif);right:-10px;top:-85px;font-size:210px;opacity:.03;pointer-events:none}.mode-info{position:absolute;left:20px;bottom:18px;z-index:2}.mode-info h3{margin:0 0 5px;font-size:17px;font-weight:900;color:#253646}.mode-info p{margin:0;font-size:11px;color:#7c8590}.card-cta{position:absolute;right:17px;bottom:15px;font-size:22px;color:#596f7d;z-index:2}.underbar{margin-top:22px;padding:15px 0;display:flex;justify-content:space-between;gap:15px;align-items:center;border-top:1px solid #ded9d0;border-bottom:1px solid #ded9d0}.underbar-left{display:flex;gap:10px;align-items:center;color:#7f8891;font-size:11px}.underbar-stamp{font-family:var(--serif);width:23px;height:23px;border:1px solid #cdab9f;color:#b46857;display:grid;place-items:center;transform:rotate(-8deg)}.underbar-actions{display:flex;gap:21px}.underbar-actions button,.underbar-actions a{padding:0;border:0;background:transparent;color:#4d6174;font-weight:800;font-size:11px;text-decoration:none}.home-footer{display:flex;justify-content:space-between;padding:22px 16px 70px;color:#aaabac;font-size:9px;letter-spacing:.09em}.proto-bar{position:absolute;right:20px;bottom:16px;background:#263d50;color:#fff;padding:8px 10px 8px 13px;border-radius:11px;z-index:20;display:flex;align-items:center;gap:10px;box-shadow:0 12px 30px #162d4750;font-size:10px;font-weight:800}.proto-label{letter-spacing:.06em}.proto-label span{color:#efaa84}.proto-bar button,.proto-bar select{background:#ffffff16;border:1px solid #ffffff33;border-radius:6px;padding:7px 9px;color:white;font-size:10px;font-weight:800}.proto-bar select option{color:#172536}.overlay[hidden]{display:none}.overlay{position:absolute;inset:0;z-index:40;display:flex;justify-content:flex-end}.overlay-scrim{position:absolute;inset:0;background:rgba(19,34,45,.5);backdrop-filter:blur(5px)}.overlay-panel{position:relative;width:min(490px,100%);height:100%;overflow:auto;background:#faf6ee;padding:40px;box-shadow:-20px 0 70px rgba(24,36,43,.18);animation:panel-in .28s ease}.overlay-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:30px}.overlay-kicker{font-size:11px;font-weight:800;letter-spacing:.2em;color:var(--verm)}.close-button{border:1px solid #d6cec4;background:#fff;border-radius:50%;width:40px;height:40px;color:#526579;font-size:25px;line-height:1}.panel-headline{font:800 35px/1.35 var(--serif);letter-spacing:-.045em;margin:0 0 12px}.panel-desc{font-size:14px;line-height:1.9;color:#737f8a;margin:0 0 28px}.panel-metric{display:flex;justify-content:space-between;border-top:1px solid #e1dbd2;padding:15px 0;font-size:13px}.panel-metric span{color:#7a8691}.panel-metric strong{color:#2c4054}.panel-hero-glyph{height:175px;display:grid;place-items:center;margin-bottom:27px;border-radius:20px;background:radial-gradient(circle,#fffdf7,#e0e9e9);font:900 110px var(--serif);color:#3c79be;text-shadow:3px 3px #1e579b,6px 9px #aabfd2,10px 15px 16px #253d5059}.panel-cta{width:100%;margin-top:15px}.panel-outline{width:100%;margin-top:12px;background:transparent;border:1px solid #c4c1bb;color:#3b5062}.panel-small{color:#8b9399;font-size:12px;line-height:1.8}.panel-eyebrow{color:#c05643;font-weight:800;font-size:11px;letter-spacing:.15em;margin-bottom:10px}.panel-stats{display:grid;gap:14px;margin:20px 0 25px}.stat-row{display:grid;grid-template-columns:65px 1fr 40px;align-items:center;gap:10px;font-size:12px;color:#596778;font-weight:800}.stat-track{height:7px;background:#dedfe0;border-radius:50px;overflow:hidden}.stat-fill{height:100%;background:#4b88c9;border-radius:50px}.stat-row:nth-child(2) .stat-fill{background:#c85e4b}.stat-row:nth-child(3) .stat-fill{background:#629d74}.mock-note{display:block;background:#f1e9dd;border:1px solid #e7d8c7;border-radius:9px;padding:13px;font-size:11px;line-height:1.6;color:#846c52;margin-top:15px}.setting-option{display:flex;justify-content:space-between;align-items:center;padding:14px 0;border-bottom:1px solid #e3ded6;font-size:13px;color:#334557}.switch-ui{background:#dce5df;border-radius:20px;padding:5px 10px;font-size:11px;color:#567461}.language-buttons{display:flex;flex-wrap:wrap;gap:8px}.language-buttons button{background:#f0eee9;color:#45576b;border:1px solid #d8d6d0;border-radius:8px;padding:11px 12px;font-size:12px}.mode-choice-list{display:grid;gap:10px}.mode-choice-list button{text-align:left;border:1px solid #ded5cd;border-radius:13px;padding:16px;background:#fffcf7;color:#2a3f51;font-weight:800;display:flex;justify-content:space-between}.mode-choice-list button:hover{border-color:var(--verm)}.staging-note{padding:12px;border-radius:10px;background:#f0eee8;border-left:3px solid var(--verm);font-size:11px;color:#677580;line-height:1.7}
@keyframes panel-in{from{transform:translateX(22px);opacity:.7}to{transform:translateX(0);opacity:1}}
@media(max-width:1170px){.app-shell{width:min(1100px,calc(100% - 60px))}.desktop-nav{gap:23px}.hero{grid-template-columns:43% 57%}.hero-copy{padding-left:4px}.hero-copy h1{font-size:clamp(37px,4.4vw,55px)}.hero-buttons{flex-wrap:wrap}.showcase{height:470px}.bottom-content{padding-left:4px;padding-right:4px}.mode-card{padding:15px}.mode-info{left:15px}}
@media(max-width:800px){.global-header{height:79px;gap:12px}.app-shell{width:calc(100% - 40px)}.desktop-nav,.save-status,.account-text{display:none}.header-actions{margin-left:auto;gap:10px}.account-button{padding:4px}.brand-seal{height:40px;width:40px;font-size:24px;border-radius:10px}.brand-jp{font-size:17px}.brand-en{font-size:8px}.hero{display:flex;flex-direction:column;min-height:0;padding-top:0}.showcase{order:0;width:100%;height:330px;margin-top:5px}.hero-copy{order:1;width:100%;padding:0 7px 30px;text-align:center}.eyebrow{justify-content:center}.hero-copy h1{margin:10px 0 13px;font-size:clamp(36px,6vw,48px);line-height:1.4}.hero-copy h1 br{display:none}.hero-copy h1 em{margin-left:8px}.hero-lead{font-size:13px;line-height:1.8;margin-bottom:21px}.hero-buttons{justify-content:center;flex-wrap:nowrap}.button{height:54px}.button-primary{min-width:0;flex:1;max-width:280px}.button-outline{min-width:0;flex:1;max-width:210px}.resume-info,.first-time-hint{justify-content:center;margin-top:17px}.showcase-corner.top-left{top:20px;left:12px}.showcase-corner.top-right{top:20px;right:9px}.showcase-label.left-glyph{left:8px;top:132px}.showcase-label.right-glyph{right:8px;top:142px}.showcase-label strong{font-size:16px}.showcase-caption{bottom:49px}.preview-picker{bottom:0}.bottom-content{padding:13px 7px 0}.section-topline{margin-bottom:17px}.section-topline h2{font-size:22px}.mode-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:11px}.mode-card{height:202px}.underbar{flex-wrap:wrap}.home-footer{flex-wrap:wrap;gap:10px}.proto-bar{right:10px;bottom:10px}.ambient-stamp{font-size:270px}}
@media(max-width:500px){.app-shell{width:calc(100% - 30px)}.global-header{height:67px}.brand-seal{width:36px;height:36px;font-size:21px}.brand-jp{font-size:15px}.brand-en{font-size:7px}.header-icon{width:27px}.showcase{height:270px;margin-top:0}.showcase::before{inset:5% 0 0}.showcase-corner.top-left{font-size:8px;left:10px;top:14px}.showcase-corner.top-left span{font-size:8px}.showcase-corner.top-right{font-size:8px;top:14px;right:3px}.showcase-label.left-glyph{top:113px;left:2px;font-size:9px}.showcase-label.right-glyph{top:122px;right:0;font-size:9px}.showcase-label strong{font-size:15px}.showcase-caption{bottom:47px;font-size:9px}.preview-picker{bottom:0}.glyph-chip,.glyph-chip-random{width:30px;height:30px;font-size:15px}.hero-copy h1{font-size:clamp(32px,9vw,42px);margin:15px 0 12px}.hero-lead{font-size:12px;margin-bottom:20px}.wide-only{display:none}.eyebrow{font-size:9px}.eyebrow-line{width:15px}.hero-buttons{gap:8px}.button{font-size:12px;height:53px;border-radius:12px}.button-primary{padding:0 12px}.button-outline{padding:0 13px}.button-icon-round{width:23px;height:23px}.resume-info{font-size:10px}.bottom-content{padding:9px 0}.section-kicker{font-size:8px}.section-topline h2{font-size:21px}.text-arrow{font-size:10px}.mode-card{height:174px;padding:12px;border-radius:15px}.mode-top .mode-number{font-size:8px}.mode-art{inset:6px 0 42px}.art-ring{width:95px;height:39px;transform:translate(23px,7px) rotate(-8deg)}.art-symbol{font-size:56px}.mode-info{left:12px;bottom:13px}.mode-info h3{font-size:14px;margin-bottom:3px}.mode-info p{font-size:9px;max-width:130px;line-height:1.4}.mode-tag{font-size:8px}.card-cta{right:9px;bottom:10px;font-size:17px}.underbar{padding:14px 0}.underbar-left{font-size:10px}.underbar-actions{gap:11px;flex-wrap:wrap}.underbar-actions button{font-size:10px}.home-footer{padding:18px 0 85px;font-size:8px;letter-spacing:0}.overlay-panel{padding:22px 24px}.panel-headline{font-size:29px}.proto-label{display:none}.proto-bar{bottom:8px;right:8px;padding:6px;gap:5px}.proto-bar button,.proto-bar select{font-size:9px;padding:5px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.001ms!important;transition-duration:.001ms!important;scroll-behavior:auto!important}}
