:root{--color-primary: #e63946;--color-primary-soft: #ffe5e7;--color-primary-dark: #c92c39;--color-accent-warm: #f5a623;--color-accent-cool: #4a90e2;--color-success: #2da44e;--color-success-soft: #dafbe1;--color-warning: #d29922;--color-warning-soft: #fff8c5;--color-danger: #cf222e;--color-danger-soft: #ffebe9;--color-info: #0969da;--color-info-soft: #ddf4ff;--color-bg: #fafbfc;--color-surface: #ffffff;--color-text: #1a1d22;--color-text-soft: #424a54;--color-text-faint: #6b7480;--color-border: #e1e5ea;--color-border-strong: #c6ccd5;--radius-xs: 6px;--radius-sm: 10px;--radius-md: 14px;--radius-lg: 20px;--space-1: 4px;--space-2: 8px;--space-3: 12px;--space-4: 16px;--space-5: 20px;--space-6: 24px;--space-8: 32px;--shadow-soft: 0 1px 2px rgba(15, 23, 42, .04);--shadow-elevated: 0 4px 14px rgba(15, 23, 42, .08);--safe-top: env(safe-area-inset-top, 0);--safe-bottom: env(safe-area-inset-bottom, 0);--max-width: 480px}[data-theme=dark]{--color-primary-soft: #4a1e23;--color-primary-dark: #ef4f5d;--color-success-soft: #143a23;--color-warning-soft: #3b2f0a;--color-danger-soft: #3b1518;--color-info-soft: #0d2840;--color-bg: #0f172a;--color-surface: #1e293b;--color-text: #f1f5f9;--color-text-soft: #cbd5e1;--color-text-faint: #94a3b8;--color-border: #334155;--color-border-strong: #475569;--shadow-soft: 0 1px 2px rgba(0, 0, 0, .3);--shadow-elevated: 0 4px 14px rgba(0, 0, 0, .45)}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{margin:0;padding:0;height:100%;font-family:-apple-system,BlinkMacSystemFont,Hiragino Kaku Gothic ProN,Yu Gothic UI,Yu Gothic,Meiryo,sans-serif;font-size:calc(15px * var(--font-scale, 1));line-height:1.55;color:var(--color-text);background:var(--color-bg);-webkit-font-smoothing:antialiased;overscroll-behavior-y:contain}#root{display:flex;justify-content:center;min-height:100vh}button{font-family:inherit;font-size:inherit;cursor:pointer;border:none;background:transparent;color:inherit;padding:0}input,textarea,select{font-family:inherit;font-size:calc(16px * var(--font-scale, 1))}a{color:var(--color-primary);text-decoration:none}h1,h2,h3,h4{margin:0;font-weight:600;line-height:1.4}h1{font-size:calc(20px * var(--font-scale, 1))}h2{font-size:calc(17px * var(--font-scale, 1))}h3{font-size:calc(15px * var(--font-scale, 1))}p{margin:0}.app-container{width:100%;max-width:var(--max-width);min-height:100vh;background:var(--color-bg);display:flex;flex-direction:column;position:relative}@media (min-width: 481px){.app-container{box-shadow:var(--shadow-elevated);border-left:1px solid var(--color-border);border-right:1px solid var(--color-border)}}.app-header{position:sticky;top:0;background:var(--color-surface);border-bottom:1px solid var(--color-border);padding:var(--space-3) var(--space-4);padding-top:calc(var(--space-3) + var(--safe-top));display:flex;align-items:center;justify-content:space-between;z-index:10;min-height:52px}.app-header h1{font-size:calc(16px * var(--font-scale, 1));font-weight:600;flex:1;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding:0 var(--space-2)}.app-header__back{background:transparent;font-size:22px;color:var(--color-text);width:36px;height:36px;display:flex;align-items:center;justify-content:center;border-radius:var(--radius-xs)}.app-header__back:active{background:var(--color-bg)}.app-header__actions{display:flex;gap:var(--space-2)}.app-header__action{width:36px;height:36px;display:flex;align-items:center;justify-content:center;font-size:18px;color:var(--color-text-soft);border-radius:var(--radius-xs)}.app-header__action--labeled{width:auto;gap:4px;padding:0 10px;border:1px solid var(--color-border-strong)}.app-header__action-label{font-size:calc(13px * var(--font-scale, 1));font-weight:600;color:var(--color-text)}.app-main{flex:1;padding:var(--space-4);padding-bottom:calc(76px + var(--safe-bottom));overflow-y:auto}.app-main--no-pad{padding:0;padding-bottom:calc(76px + var(--safe-bottom))}.bottom-nav{position:fixed;bottom:0;left:0;right:0;background:var(--color-surface);border-top:1px solid var(--color-border);display:flex;justify-content:space-around;padding:var(--space-2) 0;padding-bottom:calc(var(--space-2) + var(--safe-bottom));z-index:20;max-width:var(--max-width);margin:0 auto}.bottom-nav__item{display:flex;flex-direction:column;align-items:center;gap:2px;font-size:11px;color:var(--color-text-faint);padding:4px 8px;min-width:56px}.bottom-nav__item--active{color:var(--color-primary)}.bottom-nav__icon{font-size:20px}.card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--space-4);margin-bottom:var(--space-3)}.card--clickable{cursor:pointer;transition:transform .1s ease,border-color .1s ease}.card--clickable:active{transform:scale(.99);border-color:var(--color-border-strong)}.card--accent{border-color:var(--color-primary);background:var(--color-primary-soft)}.card__title{font-size:calc(13px * var(--font-scale, 1));font-weight:700;letter-spacing:.02em;color:var(--color-text);margin:0 0 var(--space-3)}.card__row{display:flex;justify-content:space-between;align-items:center;padding:var(--space-2) 0;font-size:calc(14px * var(--font-scale, 1))}.card__row+.card__row{border-top:1px solid var(--color-border)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);padding:12px 18px;border-radius:var(--radius-sm);font-size:calc(15px * var(--font-scale, 1));font-weight:500;min-height:48px;width:100%;transition:opacity .15s,transform .08s;border:1px solid transparent;text-align:center}.btn:active:not(:disabled){transform:scale(.985)}.btn--primary{background:var(--color-primary);color:#fff}.btn--primary:active:not(:disabled){background:var(--color-primary-dark)}.btn--secondary{background:var(--color-surface);color:var(--color-text);border-color:var(--color-border-strong)}.btn--ghost{background:transparent;color:var(--color-text-soft)}.btn--danger{background:var(--color-danger);color:#fff}.btn--sm{padding:8px 14px;font-size:calc(13px * var(--font-scale, 1));min-height:36px;width:auto;border-radius:var(--radius-xs)}.btn:disabled{opacity:.45;cursor:not-allowed}.form-group{margin-bottom:var(--space-4)}.form-label{display:block;font-size:calc(14px * var(--font-scale, 1));font-weight:600;color:var(--color-text);margin-bottom:var(--space-2)}.form-input,.form-textarea,.form-select{width:100%;padding:12px 14px;border:1px solid var(--color-border-strong);border-radius:var(--radius-sm);font-size:calc(16px * var(--font-scale, 1));background:var(--color-surface);color:var(--color-text);transition:border-color .15s,box-shadow .15s}.form-input:focus,.form-textarea:focus,.form-select:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 3px var(--color-primary-soft)}.form-textarea{min-height:96px;resize:vertical;font-family:inherit}.form-radio-group,.form-checkbox-group{display:flex;flex-direction:column;gap:var(--space-2)}.form-radio,.form-checkbox{display:flex;align-items:center;gap:var(--space-3);padding:12px 14px;border:1px solid var(--color-border);border-radius:var(--radius-sm);cursor:pointer;background:var(--color-surface)}.form-radio--checked,.form-checkbox--checked{background:var(--color-primary-soft);border-color:var(--color-primary)}.progress{display:flex;gap:3px;margin:var(--space-1) 0}.progress__dot{flex:1;height:6px;background:var(--color-border);border-radius:3px}.progress__dot--done{background:var(--color-primary)}.progress__dot--current{background:var(--color-accent-warm)}.badge{display:inline-flex;align-items:center;padding:2px 8px;border-radius:12px;font-size:calc(11px * var(--font-scale, 1));font-weight:500;letter-spacing:.02em;background:var(--color-bg);color:var(--color-text-soft);border:1px solid var(--color-border)}.badge--primary{background:var(--color-primary-soft);color:var(--color-primary-dark);border-color:transparent}.badge--warning{background:var(--color-warning-soft);color:var(--color-warning);border-color:transparent}.badge--success{background:var(--color-success-soft);color:var(--color-success);border-color:transparent}.badge--danger{background:var(--color-danger-soft);color:var(--color-danger);border-color:transparent}.badge--info{background:var(--color-info-soft);color:var(--color-info);border-color:transparent}.list-item{background:var(--color-surface);padding:var(--space-4);margin-bottom:var(--space-2);border:1px solid var(--color-border);border-radius:var(--radius-md);cursor:pointer;transition:transform .1s,border-color .1s}.list-item:active{transform:scale(.99);border-color:var(--color-border-strong)}.list-item__title{font-weight:600;font-size:calc(15px * var(--font-scale, 1));margin-bottom:2px}.list-item__meta{font-size:calc(13px * var(--font-scale, 1));color:var(--color-text-soft);margin-bottom:var(--space-2)}.list-item__footer{display:flex;align-items:center;justify-content:space-between;font-size:calc(12px * var(--font-scale, 1));color:var(--color-text-soft);margin-top:var(--space-2)}.section-title{font-size:calc(13px * var(--font-scale, 1));font-weight:700;color:var(--color-text);margin:var(--space-5) 0 var(--space-2);letter-spacing:.02em}.tabs{display:flex;background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:4px;margin-bottom:var(--space-3);overflow-x:auto;scrollbar-width:none;gap:2px}.tabs::-webkit-scrollbar{display:none}.tab{padding:8px 14px;font-size:calc(13px * var(--font-scale, 1));color:var(--color-text-soft);white-space:nowrap;border-radius:var(--radius-xs);border:none;background:transparent;flex-shrink:0}.tab--active{color:var(--color-primary);background:var(--color-primary-soft);font-weight:500}.alert{padding:12px 14px;border-radius:var(--radius-sm);font-size:calc(13px * var(--font-scale, 1));margin-bottom:var(--space-3);line-height:1.5}.alert--warning{background:var(--color-warning-soft);color:#735c0f}.alert--danger{background:var(--color-danger-soft);color:#82071e}.alert--info{background:var(--color-info-soft);color:#033c69}.alert--success{background:var(--color-success-soft);color:#14532d}.spinner{border:3px solid var(--color-border);border-top-color:var(--color-primary);border-radius:50%;width:28px;height:28px;animation:spin 1s linear infinite;margin:24px auto}@keyframes spin{to{transform:rotate(360deg)}}.empty-state{text-align:center;padding:48px 16px;color:var(--color-text-faint)}.empty-state__icon{width:56px;height:56px;margin:0 auto var(--space-3);border-radius:50%;background:var(--color-bg);display:flex;align-items:center;justify-content:center;font-size:24px}.empty-state__title{font-size:calc(15px * var(--font-scale, 1));color:var(--color-text);margin-bottom:var(--space-1);font-weight:500}.empty-state__caption{font-size:calc(13px * var(--font-scale, 1))}.toast-container{position:fixed;bottom:88px;left:50%;transform:translate(-50%);z-index:100;display:flex;flex-direction:column;gap:var(--space-2);width:calc(100% - 32px);max-width:420px;pointer-events:none}.toast{background:var(--color-text);color:#fff;padding:12px 16px;border-radius:var(--radius-md);font-size:calc(14px * var(--font-scale, 1));box-shadow:var(--shadow-elevated);display:flex;align-items:center;gap:8px;pointer-events:auto;animation:toast-in .2s ease-out}.toast--success{background:var(--color-success)}.toast--error{background:var(--color-danger)}.toast--warning{background:var(--color-warning)}.toast--info{background:var(--color-info)}@keyframes toast-in{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.flex{display:flex;gap:var(--space-2)}.flex--between{justify-content:space-between;align-items:center}.flex--col{flex-direction:column}.flex--center{justify-content:center;align-items:center}.grid{display:grid;gap:var(--space-3)}.grid--2{grid-template-columns:repeat(2,1fr)}.grid--3{grid-template-columns:repeat(3,1fr)}.text-soft{color:var(--color-text-soft)}.text-faint{color:var(--color-text-faint)}.text-primary{color:var(--color-primary)}.text-danger{color:var(--color-danger)}.text-success{color:var(--color-success)}.text-warning{color:var(--color-warning)}.text-xs{font-size:calc(11px * var(--font-scale, 1))}.text-sm{font-size:calc(13px * var(--font-scale, 1))}.text-md{font-size:calc(15px * var(--font-scale, 1))}.text-lg{font-size:calc(17px * var(--font-scale, 1))}.text-xl{font-size:calc(22px * var(--font-scale, 1))}.text-bold{font-weight:700}.mt-1{margin-top:var(--space-1)}.mt-2{margin-top:var(--space-2)}.mt-3{margin-top:var(--space-3)}.mt-4{margin-top:var(--space-4)}.mb-1{margin-bottom:var(--space-1)}.mb-2{margin-bottom:var(--space-2)}.mb-3{margin-bottom:var(--space-3)}.mb-4{margin-bottom:var(--space-4)}.divider{height:1px;background:var(--color-border);margin:var(--space-3) 0}.metric{background:var(--color-bg);border-radius:var(--radius-sm);padding:var(--space-3) var(--space-4);text-align:center}.metric__value{font-size:22px;font-weight:700;color:var(--color-text);line-height:1.1}.metric__label{font-size:11px;color:var(--color-text-soft);margin-top:var(--space-1);letter-spacing:.02em}.text-sub{color:var(--color-text-soft)}.center{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:32px}.env-banner{position:sticky;top:0;z-index:50;width:100%;background:#fde68a;color:#78350f;font-size:12px;font-weight:600;text-align:center;padding:4px 12px;border-bottom:1px solid #f59e0b;letter-spacing:.02em;line-height:1.4}[data-theme=dark] .env-banner{background:#78350f;color:#fef3c7;border-bottom-color:#b45309}.load-more{display:flex;justify-content:center;padding:var(--space-3) 0}.load-more__btn{padding:10px 18px;border:1px solid var(--color-border-strong);border-radius:var(--radius-sm);background:var(--color-surface);color:var(--color-text);font-size:13px;cursor:pointer}.load-more__btn:active{transform:scale(.985)}.session-timeout-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#0f172a99;z-index:500;display:flex;align-items:center;justify-content:center;padding:16px}.session-timeout-dialog{background:var(--color-surface);border-radius:var(--radius-md);padding:var(--space-5);max-width:420px;width:100%;box-shadow:var(--shadow-elevated)}.session-timeout-dialog__title{font-size:16px;font-weight:700;margin-bottom:var(--space-3);color:var(--color-text)}.session-timeout-dialog__body{font-size:14px;color:var(--color-text-soft);line-height:1.55;margin-bottom:var(--space-4)}.session-timeout-dialog__countdown{display:inline-block;padding:2px 10px;background:var(--color-warning-soft);color:var(--color-warning);border-radius:var(--radius-xs);font-variant-numeric:tabular-nums;font-weight:700;margin-left:4px}.session-timeout-dialog__actions{display:flex;gap:var(--space-2)}