:root{--primary: #3b82f6;--primary-hover: #2563eb;--secondary: #64748b;--secondary-hover: #475569;--background: #f8fafc;--surface: #ffffff;--border: #e2e8f0;--text: #1e293b;--text-secondary: #64748b;--shadow: 0 1px 3px rgba(0, 0, 0, .1);--shadow-lg: 0 4px 6px rgba(0, 0, 0, .1)}body{background:var(--background);color:var(--text)}.app{min-height:100vh;display:flex;flex-direction:column;max-width:600px;margin:0 auto;padding-bottom:80px}.app-header{background:var(--surface);padding:1rem;box-shadow:var(--shadow);text-align:center;position:sticky;top:0;z-index:10}.app-header h1{font-size:1.5rem;margin-bottom:.75rem}.date-picker-container{display:flex;align-items:center;justify-content:center;gap:.5rem;margin-bottom:.5rem}.date-nav-btn{background:var(--background);border:2px solid var(--border);border-radius:8px;width:40px;height:40px;font-size:1.25rem;cursor:pointer;transition:all .2s;display:flex;align-items:center;justify-content:center}.date-nav-btn:hover{background:var(--border);border-color:var(--secondary)}.date-nav-btn:active{transform:scale(.95)}.date-picker{padding:.5rem;border:2px solid var(--border);border-radius:8px;font-size:1rem;font-family:inherit;text-align:center;cursor:pointer;transition:border-color .2s}.date-picker:focus{outline:none;border-color:var(--primary)}.date-display{font-size:.875rem;color:var(--text-secondary);margin-bottom:.5rem}.today-btn{background:var(--primary);color:#fff;border:none;border-radius:6px;padding:.5rem 1rem;font-size:.875rem;font-weight:600;cursor:pointer;transition:all .2s;margin-top:.5rem}.today-btn:hover{background:var(--primary-hover)}.today-btn:active{transform:scale(.98)}.date{font-size:.875rem;color:var(--text-secondary)}.app-main{flex:1;padding:1rem;display:flex;flex-direction:column;gap:1rem}.period-card{background:var(--surface);border-radius:12px;padding:1rem;box-shadow:var(--shadow)}.period-header{display:flex;align-items:center;gap:.75rem;margin-bottom:1rem;padding-bottom:.75rem;border-bottom:2px solid var(--border)}.period-emoji{font-size:2rem}.period-title{font-size:1.25rem;font-weight:600}.activity-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:.75rem;margin-bottom:1rem}.activity-checkbox{display:flex;align-items:center;gap:.5rem;padding:.75rem;background:var(--background);border:2px solid var(--border);border-radius:8px;cursor:pointer;transition:all .2s;-webkit-user-select:none;user-select:none}.activity-checkbox:active{transform:scale(.98)}.activity-checkbox input[type=checkbox]{width:24px;height:24px;cursor:pointer}.activity-checkbox:has(input:checked){background:#dbeafe;border-color:var(--primary)}.activity-label{font-size:1rem;font-weight:500}.notes-section{margin-top:1rem}.notes-input{width:100%;padding:.75rem;border:2px solid var(--border);border-radius:8px;font-family:inherit;font-size:1rem;resize:vertical;transition:border-color .2s}.notes-input:focus{outline:none;border-color:var(--primary)}.notes-input::placeholder{color:var(--text-secondary)}.day-summary-card{background:var(--surface);border-radius:12px;padding:1rem;box-shadow:var(--shadow);margin-top:1rem}.day-summary-header{display:flex;align-items:center;gap:.75rem;margin-bottom:1rem;padding-bottom:.75rem;border-bottom:2px solid var(--border)}.day-summary-icon{font-size:2rem}.day-summary-title{font-size:1.25rem;font-weight:600;margin:0}.day-summary-content{display:flex;flex-direction:column;gap:1rem}.summary-field{display:flex;flex-direction:column;gap:.5rem}.field-label{font-size:.875rem;font-weight:600;color:var(--text)}.field-hint{font-weight:400;color:var(--text-secondary)}.summary-textarea{width:100%;padding:.75rem;border:2px solid var(--border);border-radius:8px;font-family:inherit;font-size:1rem;resize:vertical;transition:border-color .2s}.summary-textarea:focus{outline:none;border-color:var(--primary)}.photo-input{width:100%;padding:.75rem;border:2px solid var(--border);border-radius:8px;font-family:inherit;font-size:.875rem;transition:border-color .2s}.photo-input:focus{outline:none;border-color:var(--primary)}.photo-preview{margin-top:.75rem;border-radius:8px;overflow:hidden;border:2px solid var(--border)}.photo-preview-img{width:100%;height:auto;max-height:300px;object-fit:contain;display:block}.photo-help-text{margin-top:.5rem;font-size:.75rem;color:var(--text-secondary);line-height:1.4}.photo-display{display:flex;flex-direction:column;gap:.75rem}.photo-actions{display:flex;gap:1rem;justify-content:flex-start}.btn-link{background:none;border:none;color:var(--primary);font-size:.875rem;font-weight:600;cursor:pointer;padding:0;text-decoration:underline;transition:opacity .2s}.btn-link:hover{opacity:.8}.btn-link:active{transform:scale(.98)}.btn-danger-link{color:#dc2626}.photo-error{padding:1rem;background:#fee;border:2px solid #fcc;border-radius:8px;text-align:center}.photo-error p{margin:.25rem 0;font-size:.875rem}.photo-error-hint{color:var(--text-secondary);font-size:.75rem}.app-footer{position:fixed;bottom:0;left:0;right:0;background:var(--surface);padding:1rem;box-shadow:0 -2px 8px #0000001a;z-index:10}.button-group{display:flex;gap:.75rem;max-width:600px;margin:0 auto}.btn{flex:1;padding:1rem;font-size:1rem;font-weight:600;border:none;border-radius:8px;cursor:pointer;transition:all .2s;touch-action:manipulation}.btn:active{transform:scale(.98)}.btn-primary{background:var(--primary);color:#fff}.btn-primary:hover{background:var(--primary-hover)}.btn-secondary{background:var(--secondary);color:#fff}.btn-secondary:hover{background:var(--secondary-hover)}.btn-danger{background:#dc2626;color:#fff}.btn-danger:hover{background:#b91c1c}.btn:disabled{opacity:.5;cursor:not-allowed}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#00000080;z-index:100;animation:fadeIn .2s}.modal{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);width:90%;max-width:500px;max-height:80vh;background:var(--surface);border-radius:12px;box-shadow:var(--shadow-lg);z-index:101;animation:slideUp .3s;display:flex;flex-direction:column}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{transform:translate(-50%,-40%);opacity:0}to{transform:translate(-50%,-50%);opacity:1}}.modal-header{display:flex;justify-content:space-between;align-items:center;padding:1.5rem;border-bottom:1px solid var(--border)}.modal-header h2{font-size:1.25rem;margin:0}.close-btn{background:none;border:none;font-size:2rem;cursor:pointer;color:var(--text-secondary);line-height:1;padding:0;width:32px;height:32px}.modal-content{padding:1.5rem;overflow-y:auto;flex:1}.modal-actions{display:flex;gap:.75rem;margin-top:1.5rem}.share-section{margin-bottom:1.5rem}.share-section:last-child{margin-bottom:0}.share-section h3{font-size:1rem;margin-bottom:.5rem}.help-text{font-size:.875rem;color:var(--text-secondary);margin-bottom:.75rem}.share-box{display:flex;gap:.75rem;align-items:flex-start}.share-code,.share-text{flex:1;padding:.75rem;background:var(--background);border:1px solid var(--border);border-radius:6px;font-size:.875rem;overflow-x:auto;word-break:break-all}.share-text{white-space:pre-wrap;font-family:inherit}.import-textarea{width:100%;padding:.75rem;border:2px solid var(--border);border-radius:8px;font-family:inherit;font-size:.875rem;resize:vertical;margin-bottom:1rem}.import-textarea:focus{outline:none;border-color:var(--primary)}.error-message{padding:.75rem;background:#fee;color:#c00;border-radius:6px;margin-bottom:1rem;font-size:.875rem}@media (min-width: 600px){.app{padding-bottom:0}.app-footer{position:static;box-shadow:none;border-top:1px solid var(--border)}}