:root{--color-bg:#f7f8fa;--color-surface:#fff;--color-surface-alt:#f0f2f5;--color-text:#1f2937;--color-text-muted:#6b7280;--color-border:#e2e5ea;--color-primary:#2563eb;--color-primary-hover:#1d4ed8;--color-primary-text:#fff;--color-danger:#dc2626;--color-danger-bg:#fef2f2;--color-success:#16a34a;--color-success-bg:#f0fdf4;--space-xs:4px;--space-sm:8px;--space-md:16px;--space-lg:24px;--space-xl:32px;--radius:8px;--shadow:0 1px 3px #00000014;color:var(--color-text);background-color:var(--color-bg);font-family:system-ui,-apple-system,Hiragino Kaku Gothic ProN,Yu Gothic,Meiryo,sans-serif;line-height:1.6}*,:before,:after{box-sizing:border-box}body{-webkit-font-smoothing:antialiased;min-height:100vh;margin:0}h1,h2,h3,p,ul{margin:0}ul{padding:0;list-style:none}h1{font-size:1.5rem;font-weight:700}h2{font-size:1.125rem;font-weight:700}h3{font-size:1rem;font-weight:600}input,select,button{font-family:inherit;font-size:1rem}input[type=text],input[type=password],input[type=number],input[type=date],select{border:1px solid var(--color-border);border-radius:var(--radius);background:var(--color-surface);width:100%;color:var(--color-text);padding:10px 12px}input:focus,select:focus{outline:2px solid var(--color-primary);outline-offset:-1px;border-color:var(--color-primary)}input:disabled,select:disabled{background:var(--color-surface-alt);color:var(--color-text-muted);cursor:not-allowed}input::placeholder{color:var(--color-text-muted)}button{border:1px solid var(--color-border);border-radius:var(--radius);background:var(--color-surface);color:var(--color-text);cursor:pointer;padding:10px 16px;transition:background-color .15s,border-color .15s}button:hover:not(:disabled){background:var(--color-surface-alt)}button:disabled{opacity:.5;cursor:not-allowed}button.primary{background:var(--color-primary);border-color:var(--color-primary);color:var(--color-primary-text);font-weight:600}button.primary:hover:not(:disabled){background:var(--color-primary-hover);border-color:var(--color-primary-hover)}button.danger{color:var(--color-danger);border-color:var(--color-border)}button.danger:hover:not(:disabled){background:var(--color-danger-bg);border-color:var(--color-danger)}button.link{color:var(--color-primary);font-size:inherit;background:0 0;border:none;padding:0;text-decoration:underline}button.link:hover:not(:disabled){color:var(--color-primary-hover);background:0 0}.message-error{border-radius:var(--radius);background:var(--color-danger-bg);color:var(--color-danger);padding:10px 12px;font-size:.875rem}.message-success{border-radius:var(--radius);background:var(--color-success-bg);color:var(--color-success);padding:10px 12px;font-size:.875rem}.hint{color:var(--color-text-muted);font-size:.8125rem}.app{max-width:640px;padding:var(--space-md);padding-bottom:var(--space-xl);margin:0 auto}.app-header{justify-content:space-between;align-items:center;gap:var(--space-sm);padding-bottom:var(--space-md);margin-bottom:var(--space-md);border-bottom:1px solid var(--color-border);flex-wrap:wrap;display:flex}.app-header .user-name{font-weight:600}.app-header .actions{gap:var(--space-sm);display:flex}.app-header .actions button{padding:6px 12px;font-size:.875rem}.date-picker{align-items:center;gap:var(--space-sm);margin-bottom:var(--space-md);display:flex}.date-picker label{color:var(--color-text-muted);white-space:nowrap;font-size:.875rem}.date-picker input{flex:1;max-width:200px}.summary{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius);box-shadow:var(--shadow);padding:var(--space-lg) var(--space-md);margin-bottom:var(--space-lg);text-align:center}.summary .remaining-label{color:var(--color-text-muted);margin-bottom:var(--space-xs);font-size:.875rem}.summary .remaining-value{color:var(--color-primary);font-size:2.5rem;font-weight:700;line-height:1.2}.summary .remaining-value.over{color:var(--color-danger)}.summary .remaining-unit{color:var(--color-text-muted);margin-left:var(--space-xs);font-size:1rem;font-weight:600}.summary .breakdown{justify-content:center;gap:var(--space-md);margin-top:var(--space-md);padding-top:var(--space-md);border-top:1px solid var(--color-border);display:flex}.summary .breakdown-item{flex:1}.summary .breakdown-item .label{color:var(--color-text-muted);font-size:.75rem;display:block}.summary .breakdown-item .value{font-size:1.125rem;font-weight:600;display:block}.section-title{margin-bottom:var(--space-sm)}.empty-message{padding:var(--space-md);text-align:center;color:var(--color-text-muted);background:var(--color-surface-alt);border-radius:var(--radius);margin-bottom:var(--space-sm);font-size:.875rem}.record-card{align-items:flex-start;gap:var(--space-sm);background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius);padding:var(--space-md);margin-bottom:var(--space-sm);display:flex}.record-card .body{flex:1;min-width:0}.record-card .tags{gap:var(--space-xs);margin-bottom:var(--space-xs);display:flex}.record-card .tag{background:var(--color-surface-alt);color:var(--color-text-muted);border-radius:999px;padding:2px 8px;font-size:.75rem;display:inline-block}.record-card .name{word-break:break-word;font-size:1rem;font-weight:600}.record-card .detail{color:var(--color-text-muted);margin-top:2px;font-size:.875rem}.record-card .note{color:var(--color-text-muted);margin-top:var(--space-xs);word-break:break-word;font-size:.8125rem}.record-card .calorie{white-space:nowrap;font-size:1.125rem;font-weight:700}.record-card button{flex-shrink:0;padding:4px 10px;font-size:.8125rem}.record-form{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius);padding:var(--space-md);margin-bottom:var(--space-lg)}.record-form h3{margin-bottom:var(--space-sm)}.record-form .fields{gap:var(--space-sm);flex-direction:column;display:flex}.record-form .row{gap:var(--space-sm);display:flex}.record-form .row>*{flex:1}.record-form button{width:100%;margin-top:var(--space-sm)}.auth-card{max-width:400px;margin:var(--space-xl) auto;background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius);box-shadow:var(--shadow);padding:var(--space-lg)}.auth-card h1{text-align:center;margin-bottom:var(--space-lg)}.auth-card .fields{gap:var(--space-md);flex-direction:column;display:flex}.auth-card .field label{margin-bottom:var(--space-xs);font-size:.875rem;font-weight:600;display:block}.auth-card .form-actions{gap:var(--space-sm);margin-top:var(--space-lg);flex-direction:column;display:flex}.auth-card .form-actions button{width:100%}.auth-card .footer-link{margin-top:var(--space-md);text-align:center;color:var(--color-text-muted);font-size:.875rem}.auth-card .lead{color:var(--color-text-muted);margin-bottom:var(--space-md);text-align:center;font-size:.875rem}.loading{padding:var(--space-xl);text-align:center;color:var(--color-text-muted)}.section-header{margin-bottom:var(--space-sm);margin-top:var(--space-lg);justify-content:space-between;align-items:baseline;display:flex}.page-nav{margin-bottom:var(--space-md)}.page-subtitle{color:var(--color-text-muted);margin-bottom:var(--space-md);font-size:.875rem}.record-row{margin-bottom:var(--space-sm);position:relative}.record-row .record-card{margin-bottom:0;padding-bottom:40px}.record-row .edit-button{right:var(--space-md);bottom:var(--space-sm);padding:4px 10px;font-size:.8125rem;position:absolute}.record-form.editing{border-color:var(--color-primary)}.record-form .edit-actions{gap:var(--space-sm);margin-top:var(--space-sm);display:flex}.record-form .edit-actions button{flex:1;margin-top:0}@media (width>=600px){.app{padding:var(--space-lg)}h1{font-size:1.75rem}.summary .remaining-value{font-size:3rem}.record-form .form-actions{flex-direction:row;justify-content:flex-end}.auth-card .form-actions{flex-direction:row-reverse}}