.app-header{position:sticky;top:0;z-index:100;background-color:var(--color-bg-content);border-bottom:1px solid var(--color-text-disabled)}.header-content{display:flex;justify-content:space-between;align-items:center;max-width:480px;margin:0 auto;padding:var(--spacing-sm) var(--spacing-md)}.header-brand{display:flex;align-items:center;gap:var(--spacing-sm);text-decoration:none}.header-logo{width:32px;height:32px;border-radius:var(--radius-sm)}.header-titles{display:flex;flex-direction:column;gap:0}.header-title{font-size:var(--font-size-body);font-weight:var(--font-weight-bold);color:var(--color-primary);margin:0;line-height:1.2}.header-tagline{font-size:10px;font-weight:var(--font-weight-medium);color:var(--color-text-secondary);letter-spacing:.02em;line-height:1.2}.header-actions{display:flex;gap:var(--spacing-xs)}.header-btn{display:flex;align-items:center;justify-content:center;width:40px;height:40px;padding:0;color:var(--color-text-secondary);background:none;border:none;border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition-fast)}.header-btn:hover{color:var(--color-text-primary);background-color:var(--color-bg-section)}.header-btn-signout:hover{color:var(--color-text-error)}.bottom-nav{position:fixed;bottom:0;left:0;right:0;z-index:100;display:flex;justify-content:center;gap:var(--spacing-xl);padding:var(--spacing-sm) var(--spacing-md);padding-bottom:calc(var(--spacing-sm) + env(safe-area-inset-bottom,0px));background-color:var(--color-bg-content);border-top:1px solid var(--color-text-disabled)}.nav-item{display:flex;flex-direction:column;align-items:center;gap:var(--spacing-xs);padding:var(--spacing-sm) var(--spacing-lg);color:var(--color-text-secondary);text-decoration:none;border-radius:var(--radius-md);transition:all var(--transition-fast);min-width:80px}.nav-item:hover{color:var(--color-text-primary);background-color:var(--color-bg-section)}.nav-item.active{color:var(--color-primary)}.nav-item.active .nav-label{font-weight:var(--font-weight-bold)}.nav-label{font-size:var(--font-size-caption);font-weight:var(--font-weight-medium)}.app-layout{min-height:100vh;display:flex;flex-direction:column;background-color:var(--color-bg-base)}.main-content{flex:1;width:100%}:root{--color-text-primary: #212121;--color-text-secondary: #757575;--color-text-disabled: #bdbdbd;--color-text-link: #3366cc;--color-text-error: #d32f2f;--color-text-success: #2e7d32;--color-text-warning: #c0ca33;--color-bg-base: #f3f8f6;--color-bg-section: #eff5ef;--color-bg-content: #ffffff;--color-bg-content-emphasis: #f8f9fa;--color-bg-accent: linear-gradient(180deg, #a0d8ef 0%, #d2f0e4 100%);--color-primary: #4caf50;--color-primary-hover: #43a047;--color-primary-active: #388e3c;--font-family: "Noto Sans JP", "Noto Sans", "Inter", "IBM Plex Sans", system-ui, -apple-system, "Segoe UI", Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", "Helvetica Neue", "Yu Gothic UI", "Yu Gothic", Meiryo, sans-serif;--font-weight-regular: 400;--font-weight-medium: 500;--font-weight-bold: 700;--font-size-h1: 48px;--font-size-h2: 36px;--font-size-h3: 28px;--font-size-body: 16px;--font-size-caption: 14px;--font-size-ui-sm: 14px;--font-size-ui-md: 16px;--line-height-h1: 1.4;--line-height-h2: 1.4;--line-height-h3: 1.5;--line-height-body: 1.6;--line-height-caption: 1.7;--line-height-ui: 1;--line-height-normal: 1.5;--radius-sm: 4px;--radius-md: 8px;--radius-lg: 12px;--radius-xl: 16px;--radius-full: 9999px;--spacing-xs: .25rem;--spacing-sm: .5rem;--spacing-md: 1rem;--spacing-lg: 1.5rem;--spacing-xl: 2rem;--spacing-2xl: 3rem;--shadow-sm: 0 1px 2px rgba(0, 0, 0, .05);--shadow-md: 0 4px 6px rgba(0, 0, 0, .1);--shadow-lg: 0 10px 15px rgba(0, 0, 0, .1);--transition-fast: .15s ease;--transition-normal: .25s ease}[data-theme=dark]{--color-text-primary: #ffffff;--color-text-secondary: #aaaaaa;--color-text-disabled: #777777;--color-text-link: #64b5f6;--color-text-error: #cf6679;--color-text-success: #4caf50;--color-text-warning: #dce775;--color-bg-base: #121212;--color-bg-section: #1e1e1e;--color-bg-content: #2a2a2a;--color-bg-content-emphasis: #102a43;--color-bg-accent: linear-gradient(180deg, #90c2d7 0%, #80cfae 100%);--color-primary: #66bb6a;--color-primary-hover: #81c784;--color-primary-active: #4caf50;--shadow-sm: 0 1px 2px rgba(0, 0, 0, .3);--shadow-md: 0 4px 6px rgba(0, 0, 0, .4);--shadow-lg: 0 10px 15px rgba(0, 0, 0, .5)}*{box-sizing:border-box;margin:0;padding:0}html{font-size:16px;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{font-family:var(--font-family);font-weight:var(--font-weight-regular);font-size:var(--font-size-body);line-height:var(--line-height-body);color:var(--color-text-primary);background-color:var(--color-bg-base);min-height:100vh;transition:background-color var(--transition-normal),color var(--transition-normal)}:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}::selection{background-color:var(--color-primary);color:#fff}.app-container{min-height:100vh;display:flex;flex-direction:column}.main-content{flex:1;padding:var(--spacing-md);padding-bottom:calc(var(--spacing-xl) + 60px)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--spacing-sm);padding:var(--spacing-sm) var(--spacing-lg);font-family:var(--font-family);font-size:var(--font-size-ui-md);font-weight:var(--font-weight-medium);line-height:var(--line-height-ui);border:none;border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition-fast);text-decoration:none;min-height:48px}.btn:disabled{opacity:.5;cursor:not-allowed}.btn-primary{background-color:var(--color-primary);color:#fff}.btn-primary:hover:not(:disabled){background-color:var(--color-primary-hover)}.btn-primary:active:not(:disabled){background-color:var(--color-primary-active)}.btn-secondary{background-color:var(--color-bg-content);color:var(--color-text-primary);border:1px solid var(--color-text-disabled)}.btn-secondary:hover:not(:disabled){background-color:var(--color-bg-content-emphasis)}.btn-ghost{background-color:transparent;color:var(--color-text-primary)}.btn-ghost:hover:not(:disabled){background-color:var(--color-bg-content-emphasis)}.btn-large{min-height:56px;padding:var(--spacing-md) var(--spacing-xl);font-size:var(--font-size-body)}.btn-full{width:100%}.input{width:100%;padding:var(--spacing-sm) var(--spacing-md);font-family:var(--font-family);font-size:var(--font-size-body);color:var(--color-text-primary);background-color:var(--color-bg-content);border:1px solid var(--color-text-disabled);border-radius:var(--radius-md);transition:border-color var(--transition-fast);min-height:48px}.input:focus{outline:none;border-color:var(--color-primary)}.input-large{min-height:64px;font-size:var(--font-size-h3);text-align:center;font-weight:var(--font-weight-bold)}.card{background-color:var(--color-bg-content);border-radius:var(--radius-lg);padding:var(--spacing-lg);box-shadow:var(--shadow-sm)}.text-primary{color:var(--color-text-primary)}.text-secondary{color:var(--color-text-secondary)}.text-error{color:var(--color-text-error)}.text-success{color:var(--color-text-success)}.text-center{text-align:center}.mb-xs{margin-bottom:var(--spacing-xs)}.mb-sm{margin-bottom:var(--spacing-sm)}.mb-md{margin-bottom:var(--spacing-md)}.mb-lg{margin-bottom:var(--spacing-lg)}.mb-xl{margin-bottom:var(--spacing-xl)}.mt-xs{margin-top:var(--spacing-xs)}.mt-sm{margin-top:var(--spacing-sm)}.mt-md{margin-top:var(--spacing-md)}.mt-lg{margin-top:var(--spacing-lg)}.mt-xl{margin-top:var(--spacing-xl)}.flex{display:flex}.flex-col{flex-direction:column}.items-center{align-items:center}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.gap-xs{gap:var(--spacing-xs)}.gap-sm{gap:var(--spacing-sm)}.gap-md{gap:var(--spacing-md)}.gap-lg{gap:var(--spacing-lg)}.spinner{width:24px;height:24px;border:3px solid var(--color-text-disabled);border-top-color:var(--color-primary);border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.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}.loading-screen{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--spacing-md);background-color:var(--color-bg-base)}.loading-screen p{color:var(--color-text-secondary);font-size:var(--font-size-caption)}