:root{--dfl-primitive-black: #121212;--dfl-primitive-elev-1: #1e1e1e;--dfl-primitive-elev-2: #252525;--dfl-primitive-elev-3: #2a2a2a;--dfl-primitive-text-light: #f5f5f5;--dfl-primitive-text-mid: #b3b3b3;--dfl-primitive-text-dim: #8a8a8a;--dfl-primitive-pink: #D43E6A;--dfl-primitive-pink-bright: #e0456e;--dfl-primitive-cyan: #00D4FF;--dfl-primitive-emerald: #2ecc71;--dfl-primitive-red: #e74c3c;--dfl-primitive-blue: #3498db;--dfl-primitive-purple: #9b59b6;--dfl-primitive-gray: #95a5a6;--dfl-primitive-white: #fff;--dfl-bg-primary: var(--dfl-primitive-black);--dfl-bg-secondary: var(--dfl-primitive-elev-1);--dfl-bg-card: var(--dfl-primitive-elev-2);--dfl-bg-card-hover: var(--dfl-primitive-elev-3);--dfl-bg-glass: rgba(30, 30, 30, .7);--dfl-bg-overlay: rgba(0, 0, 0, .6);--dfl-text-primary: var(--dfl-primitive-text-light);--dfl-text-secondary: var(--dfl-primitive-text-mid);--dfl-text-muted: var(--dfl-primitive-text-dim);--dfl-accent: var(--dfl-primitive-pink);--dfl-accent-glow: 0 0 24px rgba(212, 62, 106, .45);--dfl-accent-secondary: var(--dfl-primitive-cyan);--dfl-accent-secondary-glow: 0 0 20px rgba(0, 212, 255, .3);--dfl-success: var(--dfl-primitive-emerald);--dfl-success-glow: 0 0 12px rgba(46, 204, 113, .4);--dfl-error: var(--dfl-primitive-red);--dfl-error-glow: 0 0 12px rgba(231, 76, 60, .4);--dfl-tone-0: var(--dfl-primitive-gray);--dfl-tone-1: var(--dfl-primitive-red);--dfl-tone-2: var(--dfl-primitive-emerald);--dfl-tone-3: var(--dfl-primitive-blue);--dfl-tone-4: var(--dfl-primitive-purple);--dfl-glass-bg: rgba(37, 37, 37, .6);--dfl-glass-bg-hover: rgba(45, 45, 45, .8);--dfl-glass-border: rgba(255, 255, 255, .14);--dfl-glass-border-active: rgba(212, 62, 106, .25);--dfl-glass-blur: 12px;--dfl-glass-blur-lg: 25px;--dfl-border-strong: rgba(255, 255, 255, .2);--dfl-glass-top-border: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, .12) 50%, rgba(255, 255, 255, 0) 100%);--dfl-radial-glow-accent: radial-gradient(640px 420px at 50% 0%, rgba(212, 62, 106, .14), transparent 70%);--dfl-radial-glow-cyan: radial-gradient(520px 360px at 82% 12%, rgba(0, 212, 255, .08), transparent 70%);--dfl-btn-texture: radial-gradient(rgba(255, 255, 255, .12) 1px, transparent 1px);--dfl-btn-texture-size: 4px 4px;--dfl-ide-dot-red: #ff5f57;--dfl-ide-dot-amber: #febc2e;--dfl-ide-dot-green: #28c840;--dfl-code-bg: #0c0c0c;--dfl-code-border: rgba(255, 255, 255, .06);--dfl-code-text: #d6d6d6;--dfl-code-muted: #6e7681;--dfl-code-string: #7ec699;--dfl-code-keyword: #cc99cd;--dfl-code-err: #ff6b6b;--dfl-error-bg: rgba(231, 76, 60, .08);--dfl-error-border-soft: rgba(231, 76, 60, .18);--dfl-success-bg: rgba(46, 204, 113, .06);--dfl-success-border-soft: rgba(46, 204, 113, .15);--dfl-accent-bright: var(--dfl-primitive-pink-bright);--dfl-accent-border-faint: rgba(212, 62, 106, .1);--dfl-accent-border-soft: rgba(212, 62, 106, .25);--dfl-accent-border: rgba(212, 62, 106, .35);--dfl-accent-glow-soft: 0 0 24px rgba(212, 62, 106, .3);--dfl-accent-glow-strong: 0 0 32px rgba(212, 62, 106, .35);--dfl-bg-nav: rgba(18, 18, 18, .85);--dfl-glass-border-subtle: rgba(255, 255, 255, .08);--dfl-toast-bg: var(--dfl-accent);--dfl-shadow-toast: 0 8px 24px rgba(0, 0, 0, .35);--dfl-space-xs: 4px;--dfl-space-sm: 8px;--dfl-space-md: 16px;--dfl-space-lg: 24px;--dfl-space-xl: 48px;--dfl-radius-sm: 6px;--dfl-radius-md: 12px;--dfl-radius-lg: 20px;--dfl-radius-full: 9999px;--dfl-shadow-sm: 0 1px 3px rgba(0, 0, 0, .4);--dfl-shadow-md: 0 4px 12px rgba(0, 0, 0, .5);--dfl-shadow-lg: 0 8px 24px rgba(0, 0, 0, .6);--dfl-font-sans: "Zen Maru Gothic", "Zen Kaku Gothic New", "M PLUS 1p", "Noto Sans JP", sans-serif;--dfl-font-mono: "SF Mono", "Menlo", "Consolas", monospace;--dfl-font-reading: "Noto Serif JP", "Hiragino Mincho ProN", serif;--dfl-font-size-sm: .875rem;--dfl-font-size-base: 1rem;--dfl-font-size-lg: 1.25rem;--dfl-font-size-xl: 1.5rem;--dfl-font-size-2xl: 2rem;--dfl-font-size-hero: 4rem;--dfl-font-size-reading: 1.5rem;--dfl-line-height-tight: 1.2;--dfl-line-height-reading: 2;--dfl-tracking-tight: -.025em;--dfl-tracking-tighter: -.045em;--dfl-tracking-normal: 0em;--dfl-tracking-wide: .05em;--dfl-transition-fast: .15s ease;--dfl-transition-normal: .3s ease;--dfl-transition-slow: .5s ease;--dfl-transition-swipe: .35s cubic-bezier(.16, 1, .3, 1);--dfl-input-bg: var(--dfl-bg-secondary);--dfl-input-bg-focus: var(--dfl-bg-card);--dfl-input-text: var(--dfl-text-primary);--dfl-input-placeholder: var(--dfl-text-muted);--dfl-input-border: var(--dfl-glass-border);--dfl-input-border-focus: var(--dfl-accent);--dfl-input-border-error: var(--dfl-error);--dfl-input-radius: var(--dfl-radius-sm);--dfl-input-shadow-focus: 0 0 0 3px rgba(212, 62, 106, .18);--dfl-glass-card-bg: rgba(30, 30, 30, .55);--dfl-form-glow-soft: 0 0 18px rgba(212, 62, 106, .1);--dfl-input-shadow-error: 0 0 0 3px rgba(231, 76, 60, .15);--dfl-btn-primary-bg: var(--dfl-accent);--dfl-btn-primary-text: var(--dfl-primitive-white);--dfl-btn-primary-hover: brightness(1.08);--dfl-btn-ghost-text: var(--dfl-text-primary);--dfl-btn-ghost-bg: rgba(255, 255, 255, .04);--dfl-btn-ghost-bg-hover: rgba(255, 255, 255, .08);--dfl-btn-ghost-border: var(--dfl-glass-border);--dfl-btn-link-text: var(--dfl-accent);--dfl-btn-disabled-opacity: .4;--dfl-btn-nav-radius: 16px;--dfl-btn-nav-height: 40px;--dfl-btn-nav-pad-x: 16px;--dfl-btn-nav-ghost-text: var(--dfl-text-secondary);--dfl-btn-nav-ghost-text-hover: var(--dfl-text-primary);--dfl-btn-nav-primary-text: var(--dfl-primitive-white);--dfl-btn-nav-primary-bg: linear-gradient(104deg, rgba(253, 253, 253, .05) 5%, rgba(240, 240, 228, .1) 100%);--dfl-btn-nav-primary-border: rgba(255, 255, 255, .05);--dfl-btn-nav-primary-blur: var(--dfl-glass-blur-lg);--dfl-btn-nav-primary-text-hover: #000000;--dfl-btn-nav-primary-bg-hover: rgba(255, 255, 255, .9);--dfl-btn-nav-primary-shadow-hover: 0 4px 12px rgba(255, 255, 255, .15);--dfl-form-error-bg: rgba(231, 76, 60, .1);--dfl-form-error-text: var(--dfl-error);--dfl-form-error-border: rgba(231, 76, 60, .3);--dfl-form-hint-text: var(--dfl-text-muted);--dfl-form-hint-satisfied: var(--dfl-success);--dfl-warn: #f0b43c;--dfl-warn-text: #ffd78a;--dfl-warn-bg: rgba(240, 180, 60, .1);--dfl-warn-border: rgba(240, 180, 60, .5)}html.light{--dfl-bg-primary: #f8f9fa;--dfl-bg-secondary: #ffffff;--dfl-bg-card: #f0f0f0;--dfl-bg-card-hover: #e8e8e8;--dfl-bg-glass: rgba(248, 249, 250, .7);--dfl-bg-overlay: rgba(0, 0, 0, .4);--dfl-text-primary: #1a1a1a;--dfl-text-secondary: #666666;--dfl-text-muted: #999999;--dfl-glass-bg: rgba(240, 240, 240, .6);--dfl-glass-bg-hover: rgba(230, 230, 230, .8);--dfl-glass-border: rgba(0, 0, 0, .06);--dfl-glass-border-active: rgba(212, 62, 106, .25);--dfl-border-strong: rgba(0, 0, 0, .12);--dfl-glass-border-subtle: rgba(0, 0, 0, .04);--dfl-bg-nav: rgba(248, 249, 250, .85);--dfl-radial-glow-accent: radial-gradient(640px 420px at 50% 0%, rgba(212, 62, 106, .07), transparent 70%);--dfl-radial-glow-cyan: radial-gradient(520px 360px at 82% 12%, rgba(0, 212, 255, .05), transparent 70%);--dfl-btn-texture: radial-gradient(rgba(0, 0, 0, .08) 1px, transparent 1px);--dfl-code-bg: #ffffff;--dfl-code-border: rgba(0, 0, 0, .08);--dfl-code-text: #24292f;--dfl-code-muted: #8b949e;--dfl-code-string: #22863a;--dfl-code-keyword: #d73a49;--dfl-code-err: #d73a49;--dfl-btn-ghost-bg: rgba(0, 0, 0, .04);--dfl-btn-ghost-bg-hover: rgba(0, 0, 0, .08);--dfl-btn-nav-primary-text: #1a1a1a;--dfl-btn-nav-primary-bg: linear-gradient(104deg, rgba(0, 0, 0, .03) 5%, rgba(0, 0, 0, .06) 100%);--dfl-btn-nav-primary-border: rgba(0, 0, 0, .06);--dfl-btn-nav-primary-text-hover: #ffffff;--dfl-btn-nav-primary-bg-hover: rgba(0, 0, 0, .85);--dfl-btn-nav-primary-shadow-hover: 0 4px 12px rgba(0, 0, 0, .12);--dfl-glass-card-bg: rgba(255, 255, 255, .72);--dfl-form-glow-soft: 0 0 18px rgba(212, 62, 106, .08);--dfl-warn-text: #9a6b00;--dfl-warn-bg: rgba(240, 180, 60, .12);--dfl-warn-border: rgba(180, 120, 20, .35);--dfl-shadow-sm: 0 1px 3px rgba(0, 0, 0, .08);--dfl-shadow-md: 0 4px 12px rgba(0, 0, 0, .08);--dfl-shadow-lg: 0 8px 24px rgba(0, 0, 0, .1);--dfl-shadow-toast: 0 8px 24px rgba(0, 0, 0, .15);--dfl-glass-top-border: linear-gradient(90deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, .06) 50%, rgba(0, 0, 0, 0) 100%)}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}[hidden]{display:none!important}body{font-family:var(--dfl-font-sans);font-size:var(--dfl-font-size-base);line-height:1.6;color:var(--dfl-text-primary);background-color:var(--dfl-bg-primary);background-image:var(--dfl-radial-glow-accent);background-repeat:no-repeat;background-position:top center;background-size:100% 560px;min-height:100vh}a{color:var(--dfl-accent);text-decoration:none;transition:color var(--dfl-transition-fast)}a:hover{color:var(--dfl-accent-secondary)}img,svg{display:block;max-width:100%}.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}.form-input{font-family:var(--dfl-font-sans);font-size:.9rem;color:var(--dfl-input-text);background:var(--dfl-input-bg);border:1px solid var(--dfl-input-border);border-radius:var(--dfl-input-radius);padding:10px 14px;outline:none;backdrop-filter:blur(var(--dfl-glass-blur));-webkit-backdrop-filter:blur(var(--dfl-glass-blur));transition:border-color var(--dfl-transition-fast),box-shadow var(--dfl-transition-fast),background var(--dfl-transition-fast),backdrop-filter var(--dfl-transition-fast)}.form-input::placeholder{color:var(--dfl-input-placeholder)}.form-input:hover{border-color:var(--dfl-glass-border-active)}.form-input:focus{background:var(--dfl-input-bg-focus);border-color:var(--dfl-input-border-focus);box-shadow:var(--dfl-input-shadow-focus),var(--dfl-form-glow-soft)}.form-input.has-error{border-color:var(--dfl-input-border-error)}.form-input.has-error:focus{box-shadow:var(--dfl-input-shadow-error)}.form-input:disabled{opacity:var(--dfl-btn-disabled-opacity);cursor:not-allowed}.form-input--otp{text-align:center;font-variant-numeric:tabular-nums;letter-spacing:.35em;font-size:1.5rem;font-family:var(--dfl-font-mono)}.password-wrap{position:relative}.password-wrap .form-input{width:100%;box-sizing:border-box;padding-right:44px}.password-toggle{position:absolute;right:10px;top:50%;transform:translateY(-50%);display:inline-flex;align-items:center;justify-content:center;background:none;border:none;padding:4px;color:var(--dfl-text-muted);cursor:pointer;line-height:0;transition:color var(--dfl-transition-fast)}.password-toggle:hover{color:var(--dfl-accent)}.password-toggle svg{width:18px;height:18px}.password-toggle .pw-eye{display:none}.password-toggle .pw-eye-off,.password-toggle.is-visible .pw-eye{display:block}.password-toggle.is-visible .pw-eye-off{display:none}.btn-primary{font-family:var(--dfl-font-sans);font-size:.95rem;font-weight:600;color:var(--dfl-btn-primary-text);background:var(--dfl-btn-primary-bg);background-image:var(--dfl-btn-texture);background-size:var(--dfl-btn-texture-size);border:none;border-radius:var(--dfl-radius-full);padding:12px 0;width:100%;cursor:pointer;transition:filter var(--dfl-transition-fast),transform var(--dfl-transition-fast)}.btn-primary:hover{filter:var(--dfl-btn-primary-hover)}.btn-primary:active{transform:scale(.99)}.btn-primary:disabled{opacity:var(--dfl-btn-disabled-opacity);cursor:not-allowed}.btn-ghost{font-family:var(--dfl-font-sans);font-size:.9rem;font-weight:500;color:var(--dfl-btn-ghost-text);background:var(--dfl-btn-ghost-bg);border:1px solid var(--dfl-btn-ghost-border);border-radius:var(--dfl-radius-full);padding:12px 0;width:100%;cursor:pointer;backdrop-filter:blur(var(--dfl-glass-blur));-webkit-backdrop-filter:blur(var(--dfl-glass-blur));transition:background var(--dfl-transition-fast),backdrop-filter var(--dfl-transition-fast)}.btn-ghost:hover{background:var(--dfl-btn-ghost-bg-hover)}.btn-link{font-family:var(--dfl-font-sans);font-size:.8rem;color:var(--dfl-btn-link-text);background:none;border:none;padding:0;cursor:pointer}.btn-link:hover{text-decoration:underline}.btn-icon{background:none;border:none;color:var(--dfl-text-muted);cursor:pointer}.btn-icon:hover{color:var(--dfl-text-primary)}.btn-nav{display:inline-flex;align-items:center;justify-content:center;height:var(--dfl-btn-nav-height);padding:0 var(--dfl-btn-nav-pad-x);font-family:var(--dfl-font-sans);font-size:var(--dfl-font-size-sm);font-weight:600;border-radius:var(--dfl-btn-nav-radius);text-decoration:none;cursor:pointer;transition:color var(--dfl-transition-fast),background-color var(--dfl-transition-fast),background-image var(--dfl-transition-fast),border-color var(--dfl-transition-fast),box-shadow var(--dfl-transition-fast)}.btn-nav-ghost{color:var(--dfl-btn-nav-ghost-text);background:transparent;border:1px solid transparent}.btn-nav-ghost:hover{color:var(--dfl-btn-nav-ghost-text-hover)}.btn-nav-primary{color:var(--dfl-btn-nav-primary-text);background-color:transparent;background-image:var(--dfl-btn-nav-primary-bg),var(--dfl-btn-texture);background-size:auto,var(--dfl-btn-texture-size);border:2px solid var(--dfl-btn-nav-primary-border);backdrop-filter:blur(var(--dfl-btn-nav-primary-blur));-webkit-backdrop-filter:blur(var(--dfl-btn-nav-primary-blur));box-shadow:var(--dfl-shadow-sm)}.btn-nav-primary:hover{color:var(--dfl-btn-nav-primary-text-hover);background-image:none;background-color:var(--dfl-btn-nav-primary-bg-hover);box-shadow:var(--dfl-btn-nav-primary-shadow-hover)}.btn-nav:focus-visible{outline:none;box-shadow:0 0 0 2px var(--dfl-bg-nav),0 0 0 4px var(--dfl-accent)}@media(max-width:1024px){.auth-login{display:inline-flex;height:36px;padding:0 12px;font-size:.8rem}}.form-hint{font-family:var(--dfl-font-sans);font-size:.72rem;color:var(--dfl-form-hint-text);margin:-2px 2px 0;transition:color var(--dfl-transition-fast)}.form-hint.is-satisfied{color:var(--dfl-form-hint-satisfied)}.form-hint.is-error{color:var(--dfl-accent);font-weight:600}.form-error{font-family:var(--dfl-font-sans);font-size:.78rem;color:var(--dfl-form-error-text);background:var(--dfl-form-error-bg);border:1px solid var(--dfl-form-error-border);border-radius:var(--dfl-radius-sm);padding:8px 12px;margin:10px 0 0}.card{position:relative;background:var(--dfl-bg-card);border:1px solid var(--dfl-glass-border);border-radius:var(--dfl-radius-lg);box-shadow:var(--dfl-shadow-md)}.card:before{content:"";position:absolute;top:0;left:0;right:0;height:1px;background:var(--dfl-glass-top-border);pointer-events:none}.card--hover:hover{background:var(--dfl-bg-card-hover);border-color:var(--dfl-glass-border-active)}.top-nav{display:flex;align-items:center;justify-content:space-between;padding:14px var(--dfl-space-lg);border-bottom:1px solid var(--dfl-glass-border);background:var(--dfl-bg-glass);backdrop-filter:blur(var(--dfl-glass-blur-lg));position:sticky;top:0;z-index:100}.top-nav a{font-family:var(--dfl-font-sans);text-decoration:none;color:inherit}.top-nav-back{font-size:.9rem;color:var(--dfl-text-muted)}.top-nav-back:hover{color:var(--dfl-text-primary)}.prose{max-width:760px;margin:0 auto;padding:var(--dfl-space-xl) var(--dfl-space-md);font-family:var(--dfl-font-sans)}.prose h1{font-size:1.6rem;font-weight:700;color:var(--dfl-text-primary);margin:0 0 12px}.prose h2{font-size:1.2rem;font-weight:600;color:var(--dfl-text-primary);margin:36px 0 8px}.prose p{font-size:.92rem;color:var(--dfl-text-secondary);margin:0 0 20px;line-height:1.8}.ide-card{background:var(--dfl-code-bg);border:1px solid var(--dfl-code-border);border-radius:var(--dfl-radius-md);overflow:hidden;font-family:var(--dfl-font-mono);text-align:left;box-shadow:var(--dfl-shadow-md)}.ide-card__bar{display:flex;align-items:center;gap:10px;padding:10px 14px;background:var(--dfl-bg-card);border-bottom:1px solid var(--dfl-code-border)}.ide-card__dots{display:flex;gap:6px}.ide-card__dot{width:10px;height:10px;border-radius:50%}.ide-card__dot--r{background:var(--dfl-ide-dot-red)}.ide-card__dot--y{background:var(--dfl-ide-dot-amber)}.ide-card__dot--g{background:var(--dfl-ide-dot-green)}.ide-card__file{font-size:.72rem;color:var(--dfl-code-muted);letter-spacing:var(--dfl-tracking-wide)}.ide-card__body{padding:14px 16px 16px;overflow-x:auto}.ide-card__line{display:flex;gap:14px;font-size:.82rem;line-height:1.9;white-space:nowrap}.ide-card__ln{color:var(--dfl-code-muted);width:1.4em;text-align:right;flex-shrink:0;user-select:none}.ide-card__code{color:var(--dfl-code-text)}.ide-card__str{color:var(--dfl-code-string)}.ide-card__kw{color:var(--dfl-code-keyword)}.ide-card__cmt{color:var(--dfl-code-muted)}.ide-card__err{color:var(--dfl-code-err);font-weight:600}.ide-card__ok{color:var(--dfl-success);font-weight:600}input:-webkit-autofill,input:-webkit-autofill:hover,input:-webkit-autofill:focus,textarea:-webkit-autofill,textarea:-webkit-autofill:hover,textarea:-webkit-autofill:focus,select:-webkit-autofill,select:-webkit-autofill:hover,select:-webkit-autofill:focus{-webkit-box-shadow:0 0 0 1000px var(--dfl-input-bg) inset!important;-webkit-text-fill-color:var(--dfl-input-text)!important;caret-color:var(--dfl-input-text)!important;border-color:var(--dfl-input-border)!important;transition:background-color 5000s ease-in-out 0s!important}