:root{--color-bg: #F7F5F2;--color-surface: #FFFFFF;--color-surface-hover: #F2EFEA;--color-text: #2D2B2A;--color-text-muted: #75706C;--color-text-inverse: #FFFFFF;--color-primary: #D46B54;--color-primary-hover: #BF5E49;--color-primary-soft: #FAEBE8;--color-success: #548263;--color-success-soft: #E9EFEA;--color-warning: #DE933C;--color-warning-soft: #FDF3E8;--color-border: #EAE4DD;--color-border-hover: #D5CEC6;--color-border-strong: #C4BBB0;--font-family: system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;--text-xs: .75rem;--text-sm: .875rem;--text-base: 1rem;--text-lg: 1.125rem;--text-xl: 1.25rem;--text-2xl: 1.5rem;--text-3xl: 2.25rem;--space-1: .25rem;--space-2: .5rem;--space-3: .75rem;--space-4: 1rem;--space-5: 1.5rem;--space-6: 2rem;--space-8: 3rem;--radius-sm: 8px;--radius-md: 12px;--radius-lg: 16px;--radius-full: 9999px;--shadow-sm: 0 1px 2px rgba(45, 43, 42, .06);--shadow-md: 0 4px 6px -1px rgba(45, 43, 42, .06), 0 2px 4px -1px rgba(45, 43, 42, .04);--shadow-lg: 0 12px 24px -4px rgba(45, 43, 42, .08);font-synthesis:none}*{box-sizing:border-box}html,body{margin:0;padding:0}body{font-family:var(--font-family);color:var(--color-text);background-color:var(--color-bg);line-height:1.5;-webkit-font-smoothing:antialiased}button{font-family:inherit;cursor:pointer}:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px;border-radius:var(--radius-sm)}h1,h2,h3,h4,p{margin:0}.text-muted{color:var(--color-text-muted)}.app-shell{max-width:800px;margin:0 auto;padding:var(--space-4);min-height:100vh;display:flex;flex-direction:column}.app-header{display:flex;align-items:center;justify-content:space-between;gap:var(--space-4);flex-wrap:wrap;padding:var(--space-2) 0 var(--space-6)}.brand{display:flex;align-items:center;gap:var(--space-2);text-decoration:none;color:var(--color-text);font-size:var(--text-xl);font-weight:600;letter-spacing:-.02em}.brand-text strong{color:var(--color-primary);font-weight:700}.header-right{display:flex;align-items:center;gap:var(--space-3)}.app-nav{display:flex;gap:var(--space-2)}.sync-badge{display:inline-flex;align-items:center;gap:var(--space-1);font-size:var(--text-xs);font-weight:600;padding:var(--space-1) var(--space-3);border-radius:var(--radius-full);border:1px solid var(--color-border);background:var(--color-surface);white-space:nowrap}.sync-dot{font-size:.6rem;line-height:1}.sync-ok{color:var(--color-success);border-color:var(--color-success-soft);background:var(--color-success-soft)}.sync-busy{color:var(--color-warning);border-color:var(--color-warning-soft);background:var(--color-warning-soft)}.sync-busy .sync-dot{animation:pulse 1s ease-in-out infinite}.sync-offline{color:var(--color-text-muted)}@keyframes pulse{50%{opacity:.25}}.gate{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:var(--space-4)}.gate-card{width:100%;max-width:360px;display:flex;flex-direction:column;align-items:center;text-align:center;gap:var(--space-3);padding:var(--space-6) var(--space-5)}.gate-emoji{font-size:2.5rem}.gate-title{font-size:var(--text-xl);font-weight:700;letter-spacing:-.02em}.gate-sub{color:var(--color-text-muted);font-size:var(--text-sm);margin-top:calc(var(--space-2) * -1)}.gate-input{width:100%;border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--space-3) var(--space-4);font-size:var(--text-base);font-family:inherit;text-align:center;transition:all .15s ease}.gate-input:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 3px var(--color-primary-soft)}.gate-error{color:var(--color-primary);font-size:var(--text-sm);font-weight:500;margin:0}.gate-btn{width:100%;border:none;border-radius:var(--radius-md);padding:var(--space-3) var(--space-4);font-size:var(--text-base);font-weight:600;color:var(--color-text-inverse);background:var(--color-primary);transition:background .15s ease}.gate-btn:hover:not(:disabled){background:var(--color-primary-hover)}.gate-btn:disabled{opacity:.6;cursor:default}.nav-link{text-decoration:none;color:var(--color-text-muted);padding:var(--space-2) var(--space-4);border-radius:var(--radius-full);font-size:var(--text-sm);font-weight:500;transition:all .2s ease;background-color:transparent}.nav-link:hover{background-color:var(--color-surface);color:var(--color-text)}.nav-link.active{background-color:var(--color-primary);color:var(--color-text-inverse);box-shadow:var(--shadow-sm)}.app-main{flex:1}.app-footer{text-align:center;color:var(--color-text-muted);font-size:var(--text-sm);padding:var(--space-8) 0 var(--space-4)}.page{display:flex;flex-direction:column;gap:var(--space-6)}.card{background:var(--color-surface);border-radius:var(--radius-lg);padding:var(--space-5);box-shadow:var(--shadow-sm);border:1px solid var(--color-border)}.section-title{font-size:var(--text-lg);font-weight:600;margin-bottom:var(--space-4);color:var(--color-text);letter-spacing:-.01em}.banner{background-color:var(--color-primary);color:var(--color-text-inverse);border:none;box-shadow:var(--shadow-md)}.banner-top{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:var(--space-3)}.banner-total{display:flex;align-items:baseline;gap:var(--space-2)}.banner-number{font-size:var(--text-3xl);font-weight:700;line-height:1;letter-spacing:-.03em}.banner-unit{font-size:var(--text-base);opacity:.9;font-weight:500}.banner-bonus{background:#fff3;padding:var(--space-1) var(--space-3);border-radius:var(--radius-full);font-size:var(--text-sm);font-weight:500}.progress-wrap{margin-top:var(--space-5)}.progress-labels{font-size:var(--text-sm);margin-bottom:var(--space-2);opacity:.95}.progress-bar{height:8px;background:#00000026;border-radius:var(--radius-full);overflow:hidden}.progress-fill{height:100%;background:var(--color-text-inverse);border-radius:var(--radius-full);transition:width .6s cubic-bezier(.22,1,.36,1)}.week-board{padding:var(--space-4) var(--space-5) var(--space-5)}.week-nav{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--space-4)}.week-arrow{border:1px solid var(--color-border);background:var(--color-surface);color:var(--color-text);width:36px;height:36px;border-radius:var(--radius-full);display:flex;align-items:center;justify-content:center;transition:all .2s ease}.week-arrow:hover{background:var(--color-surface-hover);border-color:var(--color-border-hover)}.week-title{text-align:center;display:flex;flex-direction:column;align-items:center;gap:2px}.week-range{font-weight:600;font-size:var(--text-base)}.week-today-btn{border:none;background:none;color:var(--color-text-muted);font-size:var(--text-sm);padding:0;text-decoration:underline;text-underline-offset:2px}.week-today-btn:hover{color:var(--color-text)}.week-tag{font-size:var(--text-xs);color:var(--color-primary);font-weight:600;text-transform:uppercase;letter-spacing:.05em}.board-hint{color:var(--color-text-muted);font-size:var(--text-sm);margin-bottom:var(--space-4);text-align:center}.day-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:var(--space-4)}.day-card{border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--space-4);background:var(--color-bg);transition:all .2s ease}.day-card.has-points{background:var(--color-success-soft);border-color:var(--color-success-soft)}.day-card.is-today{border-color:var(--color-primary);background:var(--color-surface);box-shadow:0 0 0 1px var(--color-primary)}.day-card-head{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:var(--space-3);padding-bottom:var(--space-2);border-bottom:1px solid var(--color-border)}.day-card.has-points .day-card-head{border-bottom-color:#54826326}.day-name{font-weight:600;font-size:var(--text-base);color:var(--color-text);display:flex;align-items:baseline;gap:var(--space-2)}.day-num{font-size:var(--text-sm);color:var(--color-text-muted);font-weight:400}.day-score{font-weight:700;color:var(--color-success);font-size:var(--text-base);display:flex;align-items:center;gap:var(--space-2)}.today-badge{font-size:var(--text-xs);color:var(--color-primary);font-weight:600;background:var(--color-primary-soft);padding:2px 6px;border-radius:var(--radius-full)}.toggles{display:flex;gap:var(--space-2);margin-bottom:var(--space-3)}.chip{flex:1;border:1px solid var(--color-border);background:var(--color-surface);border-radius:var(--radius-sm);padding:var(--space-3) var(--space-2);display:flex;flex-direction:column;align-items:center;gap:var(--space-1);transition:all .15s ease}.chip:hover{border-color:var(--color-border-hover);background:var(--color-surface-hover)}.chip-emoji{font-size:var(--text-xl)}.chip-label{font-size:var(--text-sm);font-weight:500;color:var(--color-text)}.chip-mark{width:20px;height:20px;border-radius:50%;border:1px solid var(--color-border-strong);display:flex;align-items:center;justify-content:center;font-size:10px;color:transparent;margin-top:var(--space-1)}.chip-on,.chip-on:hover{background:var(--color-primary-soft);border-color:var(--color-primary)}.chip-on .chip-mark{background:var(--color-primary);border-color:var(--color-primary);color:var(--color-text-inverse)}.steppers{display:flex;flex-direction:column;gap:var(--space-2)}.day-note{margin-top:var(--space-3);width:100%;border:1px solid var(--color-border);border-radius:var(--radius-sm);background:var(--color-surface);color:var(--color-text);font-family:inherit;font-size:var(--text-sm);line-height:1.4;padding:var(--space-2) var(--space-3);resize:vertical;min-height:2.5rem;transition:all .15s ease}.day-note::placeholder{color:var(--color-text-muted)}.day-note:hover{border-color:var(--color-border-hover)}.day-note:focus{border-color:var(--color-primary);background:var(--color-surface)}.day-note.has-note{border-color:var(--color-warning);background:var(--color-warning-soft)}.stepper{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-sm);padding:var(--space-2) var(--space-3);display:flex;align-items:center;justify-content:space-between;transition:all .15s ease}.stepper.is-active{background:var(--color-primary-soft);border-color:var(--color-primary)}.stepper-info{display:flex;align-items:center;gap:var(--space-2)}.stepper-emoji{font-size:var(--text-lg)}.stepper-label{font-size:var(--text-sm);font-weight:500;color:var(--color-text)}.stepper-controls{display:flex;align-items:center;gap:var(--space-3)}.step-btn{width:32px;height:32px;border-radius:var(--radius-full);border:1px solid var(--color-border);background:var(--color-surface);color:var(--color-text);display:flex;align-items:center;justify-content:center;transition:all .15s ease}.step-btn svg{width:14px;height:14px}.step-btn:hover:not(:disabled){background:var(--color-surface-hover);border-color:var(--color-border-hover)}.step-btn:disabled{opacity:.4;cursor:not-allowed;background:var(--color-bg)}.stepper-value{font-weight:600;font-size:var(--text-base);min-width:44px;text-align:center}.stepper-value small{font-size:var(--text-xs);color:var(--color-text-muted);font-weight:400;margin-left:2px}.breakdown-list{list-style:none;margin:0 0 var(--space-4);padding:0;display:flex;flex-direction:column;gap:var(--space-2)}.breakdown-list li{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-3);border-radius:var(--radius-sm);background:var(--color-bg);border:1px solid transparent}.breakdown-list li.is-scored{background:var(--color-success-soft);border-color:#5482631a}.bd-emoji{font-size:var(--text-xl)}.bd-label{flex:1;font-weight:500;font-size:var(--text-sm)}.bd-label small{color:var(--color-text-muted);font-weight:400}.bd-value{font-weight:600;color:var(--color-success)}.bonus-row{background:var(--color-warning-soft)!important;border:1px dashed var(--color-warning)!important}.bonus-row.is-scored{border-style:solid!important}.bonus-msg{text-align:center;font-size:var(--text-sm);color:var(--color-text-muted);margin:0 0 var(--space-4)}.bonus-msg.is-won{color:var(--color-warning);font-weight:600}.week-total{text-align:center;background:var(--color-surface);border:1px solid var(--color-border-strong);color:var(--color-text);padding:var(--space-3);border-radius:var(--radius-sm);font-size:var(--text-sm)}.week-total strong{font-size:var(--text-lg);display:block;font-weight:700;color:var(--color-primary);margin-top:2px}.rewards-hint{color:var(--color-text-muted);font-size:var(--text-sm);margin:0 0 var(--space-4);line-height:1.6}.rewards-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:var(--space-3)}.reward{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-3);border-radius:var(--radius-sm);border:1px solid var(--color-border);background:var(--color-bg);opacity:.7;filter:grayscale(1);transition:all .3s ease}.reward.is-unlocked{opacity:1;filter:none;border-color:var(--color-primary-soft);background:var(--color-surface);box-shadow:var(--shadow-sm)}.reward-emoji{font-size:var(--text-2xl)}.reward-body{flex:1;display:flex;flex-direction:column;gap:2px}.reward-label{font-weight:600;font-size:var(--text-sm);line-height:1.2}.reward-points{color:var(--color-text-muted);font-size:var(--text-xs);font-weight:500}.reward-status{text-align:right;display:flex;flex-direction:column;align-items:flex-end}.reward-count{font-size:var(--text-xs);font-weight:600;color:var(--color-success);background:var(--color-success-soft);padding:2px 6px;border-radius:var(--radius-full)}.reward-remaining{font-size:var(--text-xs);color:var(--color-text-muted)}.week-history{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:var(--space-3)}.week-history-row{display:flex;align-items:center;gap:var(--space-4);flex-wrap:wrap;padding:var(--space-4);border-radius:var(--radius-sm);background:var(--color-bg);border:1px solid var(--color-border)}.wh-week{min-width:100px}.wh-label{font-weight:600;font-size:var(--text-sm)}.wh-week small{display:block;color:var(--color-text-muted);font-size:var(--text-xs);margin-top:2px}.wh-chips{flex:1;display:flex;gap:var(--space-3);flex-wrap:wrap;font-size:var(--text-sm);font-weight:500;color:var(--color-text-muted)}.wh-chips span{display:flex;align-items:center;gap:4px;background:var(--color-surface);padding:4px 8px;border-radius:var(--radius-sm);border:1px solid var(--color-border)}.wh-bonus{color:var(--color-warning)!important;background:var(--color-warning-soft)!important;border-color:#de933c33!important}.wh-total{font-weight:700;color:var(--color-success);font-size:var(--text-base);background:var(--color-success-soft);padding:4px 10px;border-radius:var(--radius-full)}.empty-state{text-align:center;color:var(--color-text-muted);padding:var(--space-6) var(--space-4);font-size:var(--text-sm)}.danger-zone{border-color:var(--color-border);background:var(--color-bg)}.reset-btn{border:1px solid rgba(212,107,84,.3);background:var(--color-surface);color:var(--color-primary);font-weight:600;padding:var(--space-3) var(--space-4);border-radius:var(--radius-md);transition:all .2s ease;width:100%;font-size:var(--text-sm)}.reset-btn:hover{background:var(--color-primary-soft);border-color:var(--color-primary)}@media(max-width:600px){.app-shell{padding:var(--space-3)}.day-grid{grid-template-columns:1fr}.banner-number{font-size:var(--text-2xl)}.week-history-row{flex-direction:column;align-items:flex-start;gap:var(--space-3)}.wh-chips{width:100%}.wh-total{margin-left:auto}}