:root{--bg: #f0e8d8;--surface: #faf6ee;--border: #e0d5c3;--text: #3a2f24;--text-muted: #8c7e6d;--accent: #b54830;--accent-hover: #983c27;--warm: #c89f6a;--packed-bg: #ece7dd;--packed-border: #b5aa96;--packed-text: #8c8274;--radius: 14px;--font-display: "Fraunces", serif;--font-body: "DM Sans", sans-serif;font-family:var(--font-body);line-height:1.5;font-weight:400;color:var(--text);background-color:var(--bg);font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body:before{content:"";position:fixed;inset:0;z-index:0;pointer-events:none;opacity:.025;background-image:repeating-linear-gradient(45deg,var(--text) 0px,var(--text) 1px,transparent 1px,transparent 14px)}a{font-weight:500;color:var(--accent);text-decoration:inherit}a:hover{color:var(--accent-hover)}body{margin:0;min-width:320px;min-height:100vh}h1{font-family:var(--font-display);font-size:2.4em;line-height:1.1}button{border-radius:10px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:var(--font-body);background-color:var(--surface);color:var(--text);cursor:pointer;transition:all .2s}button:hover{transform:translateY(-1px);box-shadow:0 4px 14px #3a2f2414}button:focus,button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.toast{display:flex;align-items:center;gap:10px;padding:12px 16px;background:var(--surface);border:1px solid var(--border);border-radius:10px;font-size:14px;color:var(--text);box-shadow:0 2px 10px #3a2f240f}.toast__ring{width:16px;height:16px;flex-shrink:0;transform:rotate(-90deg)}.toast__ring-track{fill:none;stroke:var(--border);stroke-width:2.5}.toast__ring-fill{fill:none;stroke-width:2.5;stroke-linecap:round;stroke-dasharray:50.27;stroke-dashoffset:0;animation:toastRingShrink var(--toast-duration-ms, 2.5s) linear forwards}.toast__ring-fill--success{stroke:#5a9a6e}.toast__ring-fill--error{stroke:var(--accent)}@keyframes toastRingShrink{0%{stroke-dashoffset:0}to{stroke-dashoffset:50.27}}.toast__icon{display:flex;font-size:18px;flex-shrink:0}.toast--success .toast__icon{color:#5a9a6e}.toast--error .toast__icon{color:var(--accent)}.toast__msg{font-weight:500;line-height:1.4}.App{max-width:1200px;margin:0 auto;padding:20px;font-family:var(--font-body);flex:1 0 auto;width:100%;box-sizing:border-box;position:relative;z-index:1}.app-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px;padding-bottom:20px;border-bottom:1px solid var(--border);flex-wrap:wrap;gap:16px;animation:fadeDown .4s ease-out}.app-header h1{display:flex;align-items:center;gap:10px;color:var(--text);margin:0 20px 0 0;font-family:var(--font-display);font-size:26px;font-weight:700}.logo-mark{width:46px;height:46px;background:var(--accent);border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:24px;color:var(--surface);flex-shrink:0}.logo-text-group{display:flex;flex-direction:column}.logo-sub{font-family:var(--font-body);font-size:11px;font-weight:500;letter-spacing:1.5px;text-transform:uppercase;color:var(--text-muted);margin-top:1px}.header-summary{display:flex;gap:8px}.summary-chip{font-size:12px;font-weight:500;color:var(--text-muted);background:var(--surface);border:1px solid var(--border);padding:5px 14px;border-radius:999px}.header-actions{display:flex;gap:8px;flex-wrap:wrap}.import-btn,.export-btn{display:flex;align-items:center;gap:6px;padding:10px 18px;border:none;border-radius:10px;cursor:pointer;font-weight:500;font-size:13px;transition:all .2s}.import-btn{background-color:var(--accent);color:#fff}.import-btn:hover{background-color:var(--accent-hover)}.export-btn{background-color:var(--warm);color:#fff}.export-btn:hover{background-color:#b38c55}.export-btn:disabled{background-color:var(--border);color:var(--text-muted);cursor:not-allowed;transform:none;box-shadow:none}.import-btn:hover,.export-btn:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 4px 14px #3a2f241a}.expand-all-btn,.collapse-all-btn{background:var(--surface);color:var(--text-muted);border:1px solid var(--border);padding:10px 18px;border-radius:10px;font-size:13px;font-weight:500;cursor:pointer}.expand-all-btn:hover,.collapse-all-btn:hover{border-color:var(--text-muted);color:var(--text)}.clear-all-btn{background:#fdf0ed;color:var(--accent);border:1px solid #f0cfc7;padding:10px 18px;border-radius:10px;font-size:13px;font-weight:500;cursor:pointer;display:flex;align-items:center}.clear-all-btn:hover{background:#fbe4de;border-color:var(--accent)}.clear-all-btn:disabled{background-color:var(--surface);color:var(--text-muted);border-color:var(--border);cursor:not-allowed;transform:none;box-shadow:none}.add-baggage-section{margin-bottom:24px;animation:fadeDown .5s ease-out}.add-baggage-section h2{font-family:var(--font-display);font-size:18px;font-weight:600;color:var(--text-muted);margin-bottom:12px}.baggage-type-buttons{display:flex;gap:10px;flex-wrap:wrap}.add-baggage-btn{display:flex;align-items:center;gap:6px;padding:10px 20px;background-color:var(--surface);color:var(--text);border:1px solid var(--border);border-radius:10px;cursor:pointer;font-weight:500;font-size:13px;text-transform:capitalize;transition:all .2s}.add-baggage-btn:hover{border-color:var(--accent);color:var(--accent)}.add-baggage-btn svg{color:var(--accent)}.baggages-container{display:grid;gap:20px;grid-template-columns:repeat(auto-fit,minmax(400px,1fr))}.baggage-card{background:var(--surface);border-radius:var(--radius);border:1px solid var(--border);box-shadow:0 4px 20px #3a2f240f;overflow:hidden;animation:cardUp .5s ease-out both}.baggage-header{display:flex;justify-content:space-between;align-items:center;padding:20px 22px;border-bottom:1px solid var(--border)}.baggage-info{display:flex;flex-direction:column;gap:4px}.baggage-info h3{margin:0;font-family:var(--font-display);font-size:18px;font-weight:700;color:var(--text);text-transform:capitalize}.nickname-input{padding:6px 10px;border:1px solid var(--border);border-radius:8px;font-size:13px;font-family:var(--font-body);width:180px;color:var(--text);background:var(--bg);transition:border-color .2s}.nickname-input:focus{outline:none;border-color:var(--warm)}.header-actions-horizontal{display:flex;align-items:center;gap:8px}.delete-btn{background:none;border:none;color:var(--accent);padding:6px;border-radius:8px;cursor:pointer;display:flex;align-items:center;font-size:18px;opacity:.7;transition:all .15s}.delete-btn:hover{opacity:1;background:#fdf0ed;transform:none;box-shadow:none}.collapse-btn{background:none;border:none;color:var(--text-muted);font-size:22px;cursor:pointer;padding:6px;border-radius:8px;display:flex;align-items:center;transition:color .15s}.collapse-btn:hover{color:var(--text);transform:none;box-shadow:none}.progress-ring-wrap{position:relative;width:46px;height:46px;margin-right:8px}.progress-ring{width:46px;height:46px;transform:rotate(-90deg)}.progress-ring-text{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-family:var(--font-display);font-weight:700;font-size:11px;color:var(--text-muted)}.items-section{padding:0 22px 18px}.items-header{display:flex;justify-content:space-between;align-items:center;padding:12px 0 10px}.items-header h4{margin:0;font-size:13px;font-weight:600;color:var(--text-muted)}.items-header .header-actions{gap:4px}.items-header .header-actions button:hover{transform:none;box-shadow:none}.pack-all-btn{background:none;border:none;color:#3b82f6;font-size:18px;cursor:pointer;display:flex;align-items:center;padding:4px;border-radius:6px;transition:all .15s}.pack-all-btn:hover{background-color:#3b82f614}.add-item-btn{background:none;border:none;color:var(--warm);font-size:22px;cursor:pointer;padding:4px;display:flex;align-items:center;border-radius:6px;transition:color .15s}.add-item-btn:hover{color:var(--accent)}.add-item-section{background-color:var(--bg);padding:14px;border-radius:12px;margin-bottom:12px;border:1px solid var(--border)}.add-item-section h5{margin:0 0 8px;font-size:12px;font-weight:600;color:var(--text-muted)}.default-items-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(100px,1fr));gap:6px;margin-bottom:14px}.default-item-btn{display:flex;flex-direction:column;align-items:center;padding:10px 6px;background:var(--surface);border:1px solid var(--border);border-radius:10px;cursor:pointer;font-size:12px;color:var(--text);transition:all .15s;gap:4px}.default-item-btn:hover{border-color:var(--accent);color:var(--accent)}.default-item-btn svg{font-size:18px;color:var(--warm)}.default-item-btn:hover svg{color:var(--accent)}.custom-item-form{display:flex;gap:8px;align-items:center}.custom-item-form input{flex:1;padding:8px 12px;border:1px solid var(--border);border-radius:8px;font-family:var(--font-body);font-size:13px;background:var(--surface);color:var(--text)}.custom-item-form input:focus{outline:none;border-color:var(--warm)}.custom-item-form select{padding:8px 12px;border:1px solid var(--border);border-radius:8px;font-family:var(--font-body);font-size:13px;background:var(--surface);color:var(--text)}.custom-item-form button{padding:8px 16px;background-color:var(--accent);color:#fff;border:none;border-radius:8px;cursor:pointer;font-size:13px;font-weight:500}.custom-item-form button:hover{background-color:var(--accent-hover)}.items-list{display:flex;flex-direction:column;gap:5px}.item-card{display:flex;justify-content:space-between;align-items:center;padding:9px 12px;background:var(--bg);border:none;border-left:3px solid transparent;border-radius:10px;transition:all .15s}.item-card:hover{background:#e8dfcf}.item-card.packed{background:var(--packed-bg);border-left-color:var(--packed-border)}.item-card.packed .item-info svg{opacity:.35}.item-card.packed .item-name{text-decoration:line-through;color:var(--packed-text);opacity:.65}.item-card.packed .item-controls{opacity:.35}.item-info{display:flex;align-items:center;gap:10px}.item-info svg{font-size:16px;color:var(--warm)}.item-name{font-weight:500;font-size:14px;color:var(--text)}.item-controls{display:flex;align-items:center;gap:8px}.quantity-controls{display:flex;align-items:center;gap:2px}.item-counter-controls{width:26px;height:26px;min-width:26px;min-height:26px;display:flex;align-items:center;justify-content:center;font-size:14px;background:var(--surface);border:1px solid var(--border);border-radius:6px;color:var(--text-muted);padding:0;cursor:pointer;transition:all .15s}.item-counter-controls:hover{border-color:var(--accent);color:var(--accent);background:var(--surface)}.quantity{min-width:22px;text-align:center;font-weight:600;font-size:13px;color:var(--text)}.pack-btn{background:none;border:none;color:var(--border);font-size:18px;cursor:pointer;display:flex;align-items:center;padding:2px;transition:color .15s}.pack-btn:hover{color:var(--packed-border);transform:none;box-shadow:none}.pack-btn.packed{color:var(--packed-border)}.delete-item-btn{background:none;border:none;color:var(--accent);cursor:pointer;font-size:15px;padding:3px;display:flex;opacity:.5;transition:opacity .15s}.delete-item-btn:hover{opacity:1;transform:none;box-shadow:none}.empty-state{text-align:center;padding:60px 20px;color:var(--text-muted);grid-column:1 / -1}.empty-state svg{font-size:64px;margin-bottom:20px;color:var(--border)}.loading-state{text-align:center;padding:60px 20px;color:var(--text-muted)}.loading-state svg{font-size:64px;margin-bottom:20px;color:var(--border)}.app-footer{width:100%;text-align:center;padding:.75rem 0;border-top:1px solid var(--border);font-size:.875rem;color:var(--text-muted);background:transparent;margin-top:0;flex-shrink:0;position:relative;z-index:1}.github-link{color:inherit;text-decoration:none;vertical-align:middle;display:inline-flex;align-items:center;gap:.4em;font-weight:500;transition:color .2s}.github-link:hover,.github-link:focus{color:var(--text)}.github-link-text{font-weight:500}.github-icon{font-size:1.2em;vertical-align:middle}@keyframes fadeDown{0%{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}@keyframes cardUp{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}@media(max-width:900px){.app-header{flex-direction:column;align-items:flex-start}.app-header h1{margin-right:0}.header-actions{width:100%;display:grid;grid-template-columns:1fr 1fr;gap:8px}.header-actions button{width:100%;min-width:0;justify-content:center}.baggages-container{grid-template-columns:1fr}.baggage-type-buttons{justify-content:center}.custom-item-form{flex-direction:column;align-items:stretch}.default-items-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:600px){.App{padding:12px}}
