*,*:before,*:after{margin:0;padding:0;box-sizing:border-box}:root{--color-bg: #fafaf9;--color-surface: #ffffff;--color-border: #e8e5e1;--color-border-light: #f0eeeb;--color-text: #1a1a1a;--color-text-secondary: #5c5c5c;--color-text-muted: #8a8a8a;--color-accent: #2080d0;--color-accent-light: #d6eaff;--color-accent-dark: #1a5f9e;--header-bg: rgba(255, 255, 255, .92);--sq-light: #f0eeeb;--sq-dark: #c4b9a8;--font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif;--font-serif: Georgia, "Times New Roman", serif;--container-max: 1080px;--container-narrow: 720px;--space-xs: 4px;--space-sm: 8px;--space-md: 16px;--space-lg: 24px;--space-xl: 40px;--space-2xl: 64px;--space-3xl: 96px;--radius-sm: 8px;--radius-md: 12px;--radius-lg: 16px;--radius-full: 9999px}@media(prefers-color-scheme:dark){:root{--color-bg: #121210;--color-surface: #1a1918;--color-border: #2e2c29;--color-border-light: #232220;--color-text: #e8e5e1;--color-text-secondary: #a8a4a0;--color-text-muted: #6e6a66;--color-accent: #33a0ff;--color-accent-light: #1a2e42;--color-accent-dark: #7ac4ff;--header-bg: rgba(18, 18, 16, .92);--sq-light: #4d4a44;--sq-dark: #37342f}}html{font-size:16px;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;scroll-behavior:smooth}body{font-family:var(--font-sans);background-color:var(--color-bg);color:var(--color-text);line-height:1.6;min-height:100vh;display:flex;flex-direction:column;overflow-x:hidden}main{flex:1}img{max-width:100%;display:block}a{color:var(--color-accent);text-decoration:none;transition:color .15s ease}a:hover{color:var(--color-accent-dark)}:focus-visible{outline:2px solid var(--color-accent);outline-offset:2px}.btn:focus-visible{outline:2px solid var(--color-accent);outline-offset:3px}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.container{width:100%;max-width:var(--container-max);margin:0 auto;padding:0 var(--space-lg)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-sm);padding:12px 28px;font-size:.938rem;font-weight:600;line-height:1.4;border-radius:var(--radius-full);border:1.5px solid transparent;cursor:pointer;transition:all .2s ease;text-decoration:none;white-space:nowrap}.btn-primary{background:var(--color-text);color:var(--color-surface);border-color:var(--color-text)}.btn-primary:hover{background:var(--color-text-secondary);color:var(--color-surface);border-color:var(--color-text-secondary)}@media(prefers-color-scheme:dark){.btn-primary{background:var(--color-text);border-color:var(--color-text);color:var(--color-bg)}.btn-primary:hover{background:var(--color-text-secondary);border-color:var(--color-text-secondary);color:var(--color-bg)}}.btn-accent{background:var(--color-accent);color:var(--color-surface);border-color:var(--color-accent)}.btn-accent:hover{background:var(--color-accent-dark);border-color:var(--color-accent-dark);color:var(--color-surface)}.btn-secondary{background:transparent;color:var(--color-text);border-color:var(--color-border)}.btn-secondary:hover{border-color:var(--color-text);color:var(--color-text)}.site-header{position:sticky;top:0;z-index:100;background:var(--header-bg);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--color-border-light)}.header-inner{display:flex;align-items:center;justify-content:space-between;height:48px}.logo{display:inline-flex;align-items:center;gap:var(--space-sm);text-decoration:none;color:var(--color-text)}.logo:hover{color:var(--color-text)}.logo-icon{flex-shrink:0;border-radius:6px}.logo-text{font-weight:700;font-size:1.05rem;letter-spacing:-.01em}.header-nav{display:flex;align-items:center;gap:var(--space-xl)}.header-nav a{font-size:.875rem;font-weight:500;color:var(--color-text-secondary);text-decoration:none;transition:color .15s ease}.header-nav a:hover{color:var(--color-text)}.header-nav .nav-app{color:var(--color-accent);font-weight:600}.header-nav .nav-app:hover{color:var(--color-accent-dark)}.menu-toggle{display:none;background:none;border:none;cursor:pointer;color:var(--color-text);padding:var(--space-sm)}.mobile-nav{display:grid;grid-template-rows:0fr;transition:grid-template-rows .3s ease;background:var(--color-bg);overflow:hidden}.mobile-nav>nav{min-height:0;overflow:hidden;display:flex;flex-direction:column}.mobile-nav.is-open{grid-template-rows:1fr;border-bottom:1px solid var(--color-border-light)}.mobile-nav nav a{padding:14px var(--space-lg);font-size:1rem;font-weight:500;color:var(--color-text-secondary);border-bottom:1px solid var(--color-border-light);text-decoration:none;min-height:44px;display:flex;align-items:center}.mobile-nav nav a:first-child{padding-top:var(--space-md)}.mobile-nav nav a:last-child{border-bottom:none;padding-bottom:var(--space-lg)}.mobile-nav nav a:hover{color:var(--color-text)}@media(max-width:640px){.header-nav{display:none}.menu-toggle{display:block;min-width:44px;min-height:44px}}.hero{padding:var(--space-3xl) 0 var(--space-2xl);text-align:center;position:relative;overflow:hidden}.hero:before{content:"";position:absolute;top:-60px;right:-60px;bottom:-60px;left:-60px;background-image:conic-gradient(var(--color-text-muted) .25turn,var(--color-bg) .25turn .5turn,var(--color-text-muted) .5turn .75turn,var(--color-bg) .75turn);background-size:120px 120px;filter:blur(6px);opacity:.12;z-index:0;pointer-events:none;mask-image:radial-gradient(ellipse 80% 80% at 50% 40%,black 10%,transparent 65%);-webkit-mask-image:radial-gradient(ellipse 80% 80% at 50% 40%,black 10%,transparent 65%)}.hero-inner{max-width:var(--container-narrow);margin:0 auto;position:relative;z-index:1}.hero-badge{display:inline-flex;align-items:center;gap:var(--space-sm);padding:6px 18px;font-size:.85rem;font-weight:600;letter-spacing:.02em;color:var(--color-accent-dark);background:var(--color-accent-light);border-radius:var(--radius-full);margin-bottom:var(--space-xl)}.hero h1{font-size:clamp(2.25rem,5vw,3.5rem);font-weight:800;line-height:1.12;letter-spacing:-.03em;margin-bottom:var(--space-xl);color:var(--color-text)}.hero-sub{font-size:clamp(1rem,2.5vw,1.2rem);line-height:1.65;color:var(--color-text-secondary);max-width:540px;margin:0 auto var(--space-2xl)}.hero-cta{display:flex;flex-wrap:wrap;gap:var(--space-md);justify-content:center;margin-bottom:var(--space-xl)}.btn-lg{padding:16px 40px;font-size:1.05rem}.hero-trust{display:flex;flex-wrap:wrap;gap:var(--space-lg);justify-content:center;list-style:none;font-size:.85rem;color:var(--color-text-muted)}.hero-trust li{display:flex;align-items:center;gap:6px}.hero-trust li:before{content:"✓";color:var(--color-accent);font-weight:700;font-size:.8rem}.section-header{text-align:center;max-width:var(--container-narrow);margin:0 auto var(--space-2xl)}.section-header h2{font-size:clamp(1.5rem,3.5vw,2.2rem);font-weight:800;letter-spacing:-.02em;margin-bottom:var(--space-sm)}.section-header p{font-size:1.05rem;color:var(--color-text-secondary)}.steps-section{background:var(--color-surface);border-top:1px solid var(--color-border-light);padding:var(--space-3xl) 0 var(--space-2xl)}.steps-section .section-header{margin-bottom:var(--space-xl)}.steps-list{max-width:560px;margin:0 auto;display:flex;flex-direction:column;gap:var(--space-2xl)}.step-card{position:relative}.step-num-badge{width:32px;height:32px;border-radius:50%;background:var(--color-accent);color:#fff;font-size:.8rem;font-weight:700;display:flex;align-items:center;justify-content:center;margin:0 auto var(--space-md)}.step-content{display:flex;flex-direction:column;align-items:center}.step-text{text-align:center;margin-bottom:var(--space-lg)}.step-text h3{font-size:1.15rem;font-weight:700;letter-spacing:-.01em;margin-bottom:var(--space-xs);line-height:1.3}.step-text p{font-size:.95rem;line-height:1.65;color:var(--color-text-secondary)}.step-img{border-radius:var(--radius-lg);overflow:hidden;width:100%}.step-img img{width:100%;height:auto;display:block;-webkit-user-select:none;user-select:none;-webkit-user-drag:none}@media(max-width:640px){.steps-section{padding:var(--space-2xl) 0 var(--space-xl)}.steps-section .section-header{margin-bottom:var(--space-lg)}.step-img{border-radius:var(--radius-md)}.step-text h3{font-size:1.05rem}.step-text p{font-size:.875rem}}.example-after{padding:var(--space-xl) 0 var(--space-xl);background:var(--color-surface)}.example-footer{max-width:560px;margin:0 auto;text-align:center;padding:var(--space-2xl) var(--space-xl);background:var(--color-bg);border-radius:var(--radius-lg);border:1px solid var(--color-border)}.example-slogan{font-size:clamp(1.15rem,2.5vw,1.35rem);font-weight:700;letter-spacing:-.02em;line-height:1.35;color:var(--color-text);margin-bottom:var(--space-md)}.example-privacy{font-size:.875rem;line-height:1.65;color:var(--color-text-muted)}.reveal{opacity:0;transform:translateY(32px);transition:opacity .7s ease,transform .7s ease}.reveal.is-visible{opacity:1;transform:translateY(0)}@media(prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;transition:none}}.cta-section{padding:var(--space-3xl) 0;background:var(--color-surface)}.cta-inner{text-align:center;max-width:var(--container-narrow);margin:0 auto}.ios-badge{display:inline-flex;align-items:center;gap:var(--space-sm);padding:8px 16px;background:var(--color-text);color:var(--color-surface);border-radius:var(--radius-sm);text-decoration:none}.ios-badge-text{display:flex;flex-direction:column;text-align:left;line-height:1.2}.ios-badge-small{font-size:.55rem;font-weight:400;letter-spacing:.02em;opacity:.85}.ios-badge-large{font-size:.95rem;font-weight:700;letter-spacing:-.01em}.cta-inner h2{font-size:clamp(1.5rem,3vw,2rem);font-weight:800;letter-spacing:-.02em;margin-bottom:var(--space-sm)}.cta-value{font-size:1.05rem;color:var(--color-text-secondary);margin-bottom:var(--space-xl);max-width:480px;margin-left:auto;margin-right:auto}.cta-inner .btn-lg{margin-bottom:var(--space-xl);display:block;margin-left:auto;margin-right:auto;max-width:320px}.cta-sub{padding-top:var(--space-lg);border-top:1px solid var(--color-border-light);display:block;text-align:center}.error-page{padding:var(--space-3xl) 0;text-align:center;min-height:60vh;display:flex;align-items:center}.error-page .container{display:flex;flex-direction:column;align-items:center}.error-page h1{font-size:clamp(3rem,10vw,5rem);font-weight:800;letter-spacing:-.03em;color:var(--color-text);margin-bottom:var(--space-sm)}.error-board{width:min(70vw,400px);height:min(70vw,400px);margin-bottom:var(--space-xl);border-radius:var(--radius-md);overflow:hidden;box-shadow:0 4px 24px #1a1a1a14;position:relative}@media(prefers-color-scheme:dark){.error-board{box-shadow:0 4px 24px #12121066}}.error-grid{display:grid;grid-template-columns:repeat(8,1fr);grid-template-rows:repeat(8,1fr);width:100%;height:100%}.sq{display:flex;align-items:center;justify-content:center;aspect-ratio:1;transition:background .3s ease}.sq-l{background:var(--sq-light)}.sq-d{background:var(--sq-dark)}.sq-l.sq-visited{background:var(--vis-l, #d8f3dc)}.sq-d.sq-visited{background:var(--vis-d, #95d5b2)}.knight-piece{position:absolute;top:0;left:0;width:25px;height:25px;padding:2px;pointer-events:none;opacity:0;z-index:2;filter:drop-shadow(0 1px 2px rgba(0,0,0,.2))}@media(prefers-color-scheme:dark){.knight-piece{filter:invert(1) drop-shadow(0 1px 2px rgba(0,0,0,.4))}}.error-msg{font-size:clamp(1.5rem,4vw,2rem);font-weight:700;color:var(--color-text-secondary);margin-bottom:var(--space-xl)}.site-footer{padding:var(--space-xl) 0;background:var(--color-surface);border-top:1px solid var(--color-border)}.footer-inner{display:flex;align-items:center;justify-content:space-between;gap:var(--space-xl);padding-bottom:var(--space-lg)}.footer-brand .logo{margin-bottom:var(--space-xs)}.footer-tagline{font-size:.8rem;color:var(--color-text-muted)}.footer-links{display:flex;gap:var(--space-xl)}.footer-col{display:flex;flex-direction:column;gap:var(--space-xs)}.footer-col h4{font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--color-text-muted);margin-bottom:2px}.footer-col a{font-size:.85rem;color:var(--color-text-secondary);text-decoration:none}.footer-col a:hover{color:var(--color-text)}.footer-bottom{padding:var(--space-md) 0 0}.footer-bottom p{font-size:.75rem;color:var(--color-text-muted)}@media(max-width:540px){.footer-inner{flex-direction:column;align-items:center;text-align:center;gap:var(--space-lg)}.footer-links{justify-content:center;gap:var(--space-xl)}.footer-bottom{text-align:center}.footer-col a{padding:6px 0;min-height:44px;display:flex;align-items:center;justify-content:center}}@media(max-width:640px){.hero{padding:var(--space-2xl) 0 var(--space-xl)}.hero h1{margin-bottom:var(--space-lg)}.hero-sub{margin-bottom:var(--space-xl)}.hero-cta{flex-direction:column;align-items:stretch;margin-bottom:var(--space-lg)}.hero-cta .btn{width:100%}.btn-lg{padding:14px 24px;font-size:1rem}.cta-section{padding:var(--space-2xl) 0}.cta-inner .btn-lg{max-width:none}.steps-list{gap:var(--space-xl)}.error-page{min-height:50vh;padding:var(--space-2xl) 0}.error-msg{margin-bottom:var(--space-lg)}.legal{padding:var(--space-xl) 0 var(--space-2xl)}}.legal{padding:var(--space-2xl) 0 var(--space-3xl)}.legal-inner{max-width:var(--container-narrow);margin:0 auto}.legal-inner h1{font-size:clamp(1.75rem,4vw,2.5rem);font-weight:800;letter-spacing:-.02em;margin-bottom:var(--space-sm)}.legal-updated{font-size:.875rem;color:var(--color-text-muted);margin-bottom:var(--space-xl)}.legal-intro{font-size:1.05rem;line-height:1.7;color:var(--color-text-secondary);margin-bottom:var(--space-2xl);padding-bottom:var(--space-2xl);border-bottom:1px solid var(--color-border-light)}.legal-inner h2{font-size:1.25rem;font-weight:700;margin-top:var(--space-xl);margin-bottom:var(--space-md);letter-spacing:-.01em}.legal-inner h3{font-size:1rem;font-weight:600;margin-top:var(--space-lg);margin-bottom:var(--space-sm)}.legal-inner p{font-size:.938rem;line-height:1.7;color:var(--color-text-secondary);margin-bottom:var(--space-md)}.legal-inner ul{list-style:none;margin-bottom:var(--space-md)}.legal-inner ul li{position:relative;padding-left:var(--space-lg);margin-bottom:var(--space-sm);font-size:.938rem;line-height:1.7;color:var(--color-text-secondary)}.legal-inner ul li:before{content:"";position:absolute;left:0;top:10px;width:6px;height:6px;border-radius:50%;background:var(--color-accent)}.legal-inner a{color:var(--color-accent);text-decoration:underline;text-underline-offset:2px}.legal-inner a:hover{color:var(--color-accent-dark)}.c9-board-wrap svg{width:100%;height:auto;display:block;border-radius:var(--radius-sm);box-shadow:0 2px 12px #0000001a}@media(prefers-color-scheme:dark){.c9-board-wrap svg{box-shadow:0 2px 12px #0006}}.c9-hero{padding:var(--space-3xl) 0 var(--space-xl);text-align:center}.c9-hero h1{font-size:clamp(1.75rem,5vw,2.5rem);font-weight:700;letter-spacing:-.02em;line-height:1.15}.c9-subtitle{margin-top:var(--space-sm);font-size:1.125rem;color:var(--color-text-secondary)}.c9-generator{padding-bottom:var(--space-2xl)}.c9-container{max-width:520px;display:flex;flex-direction:column;align-items:center;gap:var(--space-lg)}.c9-board-wrap{width:100%;max-width:400px}.c9-controls{width:100%;max-width:400px;display:flex;flex-direction:column;gap:var(--space-md)}.c9-nav-row{display:flex;align-items:center;justify-content:center;gap:var(--space-md)}.c9-btn{display:inline-flex;align-items:center;justify-content:center;border:none;background:none;cursor:pointer;color:var(--color-text);transition:color .15s ease}.c9-btn:hover{color:var(--color-accent)}.c9-btn-icon{width:40px;height:40px;border-radius:var(--radius-sm);background:var(--color-surface);border:1.5px solid var(--color-border)}.c9-btn-icon:hover{border-color:var(--color-accent)}.c9-num-group{display:flex;flex-direction:column;align-items:center;gap:2px}.c9-label{font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:.06em;color:var(--color-text-muted)}.c9-num-display{display:flex;align-items:center;gap:var(--space-sm)}.c9-num-hash{font-size:1.5rem;font-weight:700;letter-spacing:-.02em;color:var(--color-text)}.c9-num-input{font-size:1.5rem;font-weight:700;letter-spacing:-.02em;font-variant-numeric:tabular-nums;background:none;border:none;color:var(--color-text);width:4ch;padding:0;outline:none;-moz-appearance:textfield;border-bottom:1.5px solid transparent;transition:border-color .15s ease}.c9-num-input:hover{border-bottom-color:var(--color-border)}.c9-num-input:focus{border-bottom-color:var(--color-accent)}.c9-num-input::-webkit-inner-spin-button,.c9-num-input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.c9-badge{font-size:.688rem;font-weight:600;text-transform:uppercase;letter-spacing:.04em;padding:2px 8px;border-radius:var(--radius-full);background:var(--color-accent-light);color:var(--color-accent)}.c9-random-row{display:flex;justify-content:center}.c9-random-btn{padding:10px 32px;font-size:1rem}.c9-arrangement-row{display:flex;align-items:center;gap:var(--space-sm)}.c9-arrangement{font-family:ui-monospace,SFMono-Regular,SF Mono,Menlo,monospace;font-size:1.125rem;font-weight:600;letter-spacing:.15em;color:var(--color-text)}.c9-fen-row{display:flex;flex-direction:column;gap:4px}.c9-fen-box{display:flex;align-items:center;gap:var(--space-sm);padding:8px 12px;background:var(--color-surface);border:1.5px solid var(--color-border);border-radius:var(--radius-sm);overflow:hidden}.c9-fen{flex:1;font-family:ui-monospace,SFMono-Regular,SF Mono,Menlo,monospace;font-size:.75rem;line-height:1.4;color:var(--color-text-secondary);word-break:break-all;-webkit-user-select:all;user-select:all}.c9-copy-btn{flex-shrink:0;padding:6px 14px;font-size:.813rem;font-weight:600;border:1.5px solid var(--color-border);border-radius:var(--radius-full);background:var(--color-bg);color:var(--color-text);cursor:pointer;transition:all .15s ease;white-space:nowrap}.c9-copy-btn:hover{border-color:var(--color-accent);color:var(--color-accent)}.c9-copy-btn.copied{border-color:#22c55e;color:#22c55e;background:#22c55e14}.c9-kbd-hint{text-align:center;font-size:.75rem;color:var(--color-text-muted)}.c9-kbd-hint kbd{display:inline-block;padding:1px 6px;font-family:ui-monospace,SFMono-Regular,SF Mono,Menlo,monospace;font-size:.688rem;border:1px solid var(--color-border);border-radius:4px;background:var(--color-surface)}@media(max-width:640px){.c9-kbd-hint{display:none}.c9-hero{padding:var(--space-2xl) 0 var(--space-lg)}.c9-btn-icon{width:44px;height:44px}.c9-cta{padding:14px 24px;font-size:1rem}}.c9-ctas{width:100%;max-width:400px;display:flex;flex-direction:column;gap:var(--space-sm)}.c9-cta{width:100%;justify-content:center}.c9-cta svg{flex-shrink:0}