@import url('./modules/tokens.css');
@import url('./modules/base.css');

        /* ─── LAYOUT ────────────────────────────────────────────── */
        .container {
            max-width: 920px;
            margin: 0 auto;
            width: 100%;
            padding: 0 8px;
        }

        /* ─── HEADER ────────────────────────────────────────────── */
        .app-header {
            display: flex;
            align-items: center;
            justify-content: space-between;
            margin-bottom: 18px;
            padding: 0 4px;
        }

        .app-logo {
            display: flex;
            align-items: center;
            gap: 8px;
        }

        .app-logo-icon {
            width: 36px;
            height: 36px;
            border-radius: var(--r-sm);
            background: linear-gradient(135deg, var(--indigo), var(--violet));
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 1.1rem;
            overflow: hidden;
            box-shadow: 0 3px 14px rgba(90, 103, 242, 0.35);
        }

        .app-logo-icon img { width: 100%; height: 100%; display: block; }

        .app-logo-text {
            font-size: 1.05rem;
            font-weight: 900;
            letter-spacing: -0.4px;
            background: linear-gradient(90deg, #e8edf5, #8b9ec5);
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
            background-clip: text;
        }

        .header-right {
            display: flex;
            align-items: center;
            gap: 8px;
        }

        .app-version {
            font-size: .55rem;
            color: var(--muted);
            font-family: 'DM Mono', monospace;
            background: var(--surface);
            border: 1px solid var(--border);
            padding: 2px 6px;
            border-radius: 20px;
        }

        /* ── Install banner ── */
        .install-banner {
            display: none;
            align-items: center;
            gap: 10px;
            background: rgba(90, 103, 242, 0.1);
            border: 1px solid rgba(90, 103, 242, 0.3);
            border-radius: var(--r-md);
            padding: 10px 14px;
            margin-bottom: 14px;
            font-size: .78rem;
            color: var(--indigo-h);
            cursor: pointer;
            animation: fadeIn .3s ease;
        }

        .install-banner.visible { display: flex; }
        .install-banner-text { flex: 1; font-weight: 600; }
        .install-banner-close { background: none; border: none; color: var(--muted); cursor: pointer; font-size: 1rem; }

        /* ─── CARDS ─────────────────────────────────────────────── */
        .card {
            width: 100%;
            background: var(--surface);
            border: 1px solid var(--border);
            border-radius: var(--r-xl);
            padding: 18px;
            margin-bottom: 14px;
            transition: border-color .2s;
        }

        .section-label {
            font-size: .65rem;
            font-weight: 700;
            color: var(--muted);
            text-transform: uppercase;
            letter-spacing: 1.2px;
            margin-bottom: 14px;
            display: flex;
            align-items: center;
            gap: 6px;
        }

        .section-label::after {
            content: '';
            flex: 1;
            height: 1px;
            background: var(--border);
        }

        /* ─── SETUP GRID ────────────────────────────────────────── */
        .setup-grid {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 10px;
            margin-bottom: 10px;
        }

        .input-box {
            background: var(--bg);
            border: 1px solid var(--border);
            border-radius: var(--r-md);
            padding: 10px 12px;
            transition: border-color .2s;
        }

        .input-box:focus-within { border-color: var(--violet); }

        .input-box label {
            display: block;
            font-size: .6rem;
            font-weight: 700;
            color: var(--muted);
            letter-spacing: 1px;
            text-transform: uppercase;
            margin-bottom: 5px;
        }

        input, select {
            background: transparent;
            border: none;
            color: var(--text);
            width: 100%;
            font-size: .9rem;
            font-family: 'DM Sans', sans-serif;
            font-weight: 500;
            outline: none;
            appearance: none;
            -webkit-appearance: none;
        }

        select option { background: var(--surface2); color: var(--text); }

        /* ─── WEATHER ───────────────────────────────────────────── */
        .weather-grid {
            display: flex;
            gap: 6px;
            margin-top: 6px;
            flex-wrap: wrap;
        }

        .weather-btn {
            flex: 1;
            min-width: 60px;
            background: var(--bg);
            border: 2px solid var(--border);
            padding: 8px 5px;
            border-radius: var(--r-sm);
            cursor: pointer;
            text-align: center;
            font-size: .72rem;
            font-family: 'DM Sans', sans-serif;
            font-weight: 600;
            color: var(--subtle);
            transition: all .2s;
            user-select: none;
            appearance: none;
            -webkit-appearance: none;
        }

        .weather-btn:hover, .weather-btn:focus-visible { border-color: var(--amber); color: var(--amber); outline: none; transform: translateY(-1px); }
        .weather-btn.active { border-color: var(--amber); background: rgba(245,158,11,.18); color: var(--amber); box-shadow: 0 2px 12px rgba(245,158,11,.3); transform: translateY(-2px); }
        .weather-btn:active { transform: scale(.97); }

        /* ─── ACTIVITIES ────────────────────────────────────────── */
        .activity-grid {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(130px, 1fr));
            gap: 12px;
            margin: 10px 0 18px;
        }

        .activity-grid > .act-btn {
            background: var(--surface2);
            border: 2px solid rgba(148, 163, 184, .5);
            padding: 16px 12px;
            border-radius: var(--r-md);
            cursor: pointer;
            text-align: center;
            font-family: 'DM Sans', sans-serif;
            color: var(--subtle);
            transition: all .2s;
            user-select: none;
            will-change: transform;
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            gap: 5px;
            min-height: 96px;
            width: 100%;
            box-shadow: inset 0 1px rgba(255,255,255,.05), 0 4px 14px rgba(0,0,0,.18);
            position: relative;
            appearance: none;
            -webkit-appearance: none;
        }

        .activity-grid > .act-btn:hover,
        .activity-grid > .act-btn:focus-visible {
            border-color: var(--violet-h);
            color: var(--text);
            outline: 3px solid rgba(139, 92, 246, .2);
            outline-offset: 2px;
            transform: translateY(-2px);
        }

        .activity-grid > .act-btn:active { transform: scale(.97); }

        .activity-grid > .act-btn.active {
            border-color: var(--violet-h);
            background: linear-gradient(145deg, rgba(90, 103, 242, .32), rgba(139, 92, 246, .2));
            color: var(--text);
            transform: translateY(-2px);
            box-shadow: 0 3px 12px rgba(139, 92, 246, .25);
            animation: activity-selected .25s ease-out;
        }

        @keyframes activity-selected {
            0% { transform: scale(.94); }
            70% { transform: translateY(-3px) scale(1.02); }
            100% { transform: translateY(-2px) scale(1); }
        }

        .activity-grid > .act-btn.active::after {
            content: '✓';
            position: absolute;
            top: 6px;
            right: 8px;
            color: var(--violet-h);
            font-size: .72rem;
            font-weight: 900;
        }

        .activity-grid > .act-btn i {
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 1.75rem;
            font-style: normal;
            line-height: 1;
        }

        .activity-grid > .act-btn span {
            font-size: .78rem;
            font-weight: 800;
            line-height: 1.2;
        }

        /* ─── TOGGLES ───────────────────────────────────────────── */
        .toggle-group {
            display: flex;
            align-items: center;
            gap: 10px;
            background: var(--bg);
            padding: 10px 12px;
            border-radius: var(--r-md);
            margin-top: 10px;
            cursor: pointer;
            border: 2px solid transparent;
            transition: all .2s;
            user-select: none;
        }

        .toggle-group:hover { border-color: var(--border2); }
        .toggle-group.active { border-color: var(--emerald); background: rgba(16, 185, 129, .08); }

        .toggle-icon {
            width: 32px;
            height: 32px;
            border-radius: 10px;
            background: rgba(16, 185, 129, .12);
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: .9rem;
            flex-shrink: 0;
        }

        .toggle-group.active .toggle-icon { background: rgba(16, 185, 129, .2); }

        .toggle-text-main { font-size: .78rem; font-weight: 700; }
        .toggle-text-sub { font-size: .6rem; color: var(--muted); margin-top: 1px; }

        .laundry-info {
            display: none;
            margin-top: 6px;
            padding: 7px 12px;
            background: rgba(16, 185, 129, .06);
            border: 1px solid rgba(16, 185, 129, .2);
            border-radius: var(--r-sm);
            font-size: .68rem;
            color: var(--emerald);
            font-weight: 600;
        }

        .laundry-info.visible { display: block; }

        .laundry-freq {
            display: none;
            margin-top: 8px;
            padding: 8px 12px;
            background: var(--bg);
            border-radius: var(--r-sm);
            border: 1px solid var(--border);
            flex-wrap: wrap;
            align-items: center;
            gap: 7px;
            font-size: .72rem;
            color: var(--subtle);
        }

        .laundry-freq.visible { display: flex; }

        .laundry-freq input {
            width: 44px;
            text-align: center;
            background: var(--surface);
            border: 1px solid var(--border2);
            border-radius: 8px;
            padding: 3px 5px;
            color: var(--text);
            font-family: 'DM Mono', monospace;
            font-size: .8rem;
        }

        /* ─── TEMPLATE ROW ──────────────────────────────────────── */
        .template-row {
            display: flex;
            gap: 6px;
            margin-top: 12px;
            align-items: center;
            flex-wrap: wrap;
        }

        .template-row input {
            flex: 1;
            min-width: 100px;
            background: var(--bg);
            border: 1px solid var(--border);
            border-radius: var(--r-sm);
            padding: 7px 10px;
            color: var(--text);
            font-family: 'DM Sans', sans-serif;
        }

        .template-row input:focus { border-color: var(--violet); outline: none; }

        .template-row select {
            flex: 1;
            min-width: 120px;
            background: var(--bg);
            border: 1px solid var(--border);
            border-radius: var(--r-sm);
            padding: 7px 9px;
            color: var(--text);
            font-family: 'DM Sans', sans-serif;
        }

        /* ─── BUTTONS ───────────────────────────────────────────── */
        .btn-main {
            width: 100%;
            background: linear-gradient(135deg, var(--indigo), var(--violet));
            color: white;
            border: none;
            padding: 16px;
            border-radius: var(--r-md);
            font-family: 'DM Sans', sans-serif;
            font-weight: 900;
            font-size: .95rem;
            letter-spacing: .25px;
            cursor: pointer;
            transition: all .2s;
            box-shadow: 0 3px 18px rgba(90, 103, 242, .3);
            position: relative;
            z-index: 1;
            touch-action: manipulation;
        }

        .btn-main:hover { transform: translateY(-2px); box-shadow: 0 7px 25px rgba(90, 103, 242, .45); }
        .btn-main:active { transform: scale(.98); }

        .btn-sm {
            background: var(--violet);
            color: white;
            border: none;
            padding: 6px 12px;
            border-radius: 8px;
            cursor: pointer;
            font-family: 'DM Sans', sans-serif;
            font-weight: 700;
            font-size: .78rem;
            transition: all .2s;
            white-space: nowrap;
            position: relative;
            z-index: 2;
            touch-action: manipulation;
        }

        .btn-sm:hover { background: var(--indigo); }
        .btn-sm.danger { background: rgba(244, 63, 94, .2); color: var(--rose); border: 1px solid rgba(244, 63, 94, .3); }
        .btn-sm.danger:hover { background: rgba(244, 63, 94, .35); }

        /* ─── STATS BAR ─────────────────────────────────────────── */
        .stats-bar {
            background: rgba(17, 24, 39, .96);
            backdrop-filter: blur(16px);
            -webkit-backdrop-filter: blur(16px);
            border: 1px solid var(--border2);
            border-radius: var(--r-xl);
            padding: 14px 18px;
            margin-bottom: 14px;
            display: none;
            position: sticky;
            top: calc(var(--safe-top) + 10px);
            z-index: 45;
            box-shadow: 0 10px 32px rgba(0, 0, 0, .5);
        }

        .stats-bar.visible { display: block; }

        .stats-top {
            display: flex;
            justify-content: space-between;
            align-items: center;
            margin-bottom: 10px;
            flex-wrap: wrap;
            gap: 6px;
        }

        .stats-label { font-size: .65rem; font-weight: 800; color: var(--muted); text-transform: uppercase; letter-spacing: 1.2px; }

        .stats-chips { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }

        .chip { display: flex; align-items: center; gap: 4px; background: var(--bg); border: 1px solid var(--border); border-radius: 20px; padding: 3px 8px; }
        .chip-icon { font-size: .75rem; }
        .chip-val { font-family: 'DM Mono', monospace; font-size: .78rem; font-weight: 500; transition: color .3s; }
        .chip-val.light { color: var(--wl); }
        .chip-val.mid { color: var(--wm); }
        .chip-val.heavy { color: var(--wh); }
        .chip-val.neutral { color: var(--subtle); }
        .chip-label { font-size: .58rem; color: var(--muted); }

        .pct-display { font-family: 'DM Mono', monospace; font-size: 1.3rem; font-weight: 500; transition: color .4s; min-width: 50px; text-align: right; }
        .pct-display.zero { color: var(--muted); }
        .pct-display.mid { color: var(--amber); }
        .pct-display.done { color: var(--emerald); }

        .progress-track { height: 7px; background: var(--bg); border-radius: 99px; overflow: hidden; margin-bottom: 8px; border: 1px solid var(--border); }
        .progress-fill { height: 100%; border-radius: 99px; background: linear-gradient(90deg, var(--indigo), var(--violet), var(--cyan)); transition: width .5s cubic-bezier(.4, 0, .2, 1); }

        .weight-track { height: 4px; background: var(--bg); border-radius: 99px; overflow: hidden; border: 1px solid var(--border); }
        .weight-fill { height: 100%; border-radius: 99px; transition: width .5s cubic-bezier(.4, 0, .2, 1), background .4s; }
        .weight-fill.light { background: var(--wl); }
        .weight-fill.mid { background: var(--wm); }
        .weight-fill.heavy { background: var(--wh); }

        .weight-legend { display: flex; gap: 12px; margin-top: 6px; }
        .w-tick { font-size: .58rem; color: var(--muted); display: flex; align-items: center; gap: 3px; }
        .w-tick::before { content: ''; width: 5px; height: 5px; border-radius: 50%; }
        .w-tick.tl::before { background: var(--wl); }
        .w-tick.tm::before { background: var(--wm); }
        .w-tick.th::before { background: var(--wh); }

        .daytrip-banner { display: none; background: rgba(34, 211, 238, .08); border: 1px solid rgba(34, 211, 238, .25); border-radius: var(--r-sm); padding: 8px 12px; font-size: .72rem; color: var(--cyan); margin-top: 8px; font-weight: 600; }
        .daytrip-banner.visible { display: block; }

        /* ─── SEARCH ────────────────────────────────────────────── */
        .search-box {
            display: flex;
            align-items: center;
            gap: 8px;
            background: var(--surface);
            border: 1px solid var(--border);
            border-radius: var(--r-md);
            padding: 10px 14px;
            margin-bottom: 12px;
            transition: border-color .2s;
            position: relative;
            z-index: 1;
            width: 100%;
        }

        .search-box:focus-within { border-color: var(--violet); }
        .search-box input { flex: 1; font-size: .85rem; }
        .search-icon { color: var(--muted); font-size: .85rem; }
        .search-clear { background: none; border: none; color: var(--muted); cursor: pointer; font-size: .9rem; padding: 0; display: none; }
        .search-clear.visible { display: block; }

        /* ─── LIST GRID ─────────────────────────────────────────── */
        .list-grid {
            display: grid;
            grid-template-columns: 1fr;
            gap: 12px;
            position: relative;
            z-index: 1;
            padding: 0 2px;
            width: 100%;
        }

        @media (min-width: 640px) {
            .list-grid { grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); padding: 0; }
        }

        /* ─── CATEGORY BOX ──────────────────────────────────────── */
        .cat-box {
            background: var(--surface);
            border: 1px solid var(--border);
            border-radius: var(--r-lg);
            padding: 14px;
            animation: fadeIn 0.25s ease-out;
            min-width: 0;
        }

        @keyframes fadeIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }

        .cat-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; padding-bottom: 8px; border-bottom: 1px solid var(--border); }
        .cat-name { font-size: .7rem; font-weight: 800; color: var(--subtle); text-transform: uppercase; letter-spacing: 1px; }
        .cat-count { background: rgba(139, 92, 246, .2); color: var(--violet-h); font-size: .63rem; font-weight: 700; font-family: 'DM Mono', monospace; padding: 2px 6px; border-radius: 20px; }

        /* ─── ITEM ROW ──────────────────────────────────────────── */
        .item-row {
            display: flex;
            align-items: flex-start;
            justify-content: space-between;
            padding: 10px 9px;
            border-radius: var(--r-sm);
            margin-bottom: 3px;
            cursor: pointer;
            border: 1px solid transparent;
            transition: all .15s;
            position: relative;
            z-index: 2;
            min-width: 0;
            touch-action: manipulation;
        }

        .item-row.pending:hover { background: var(--surface2); border-color: var(--border2); }
        .item-row.taken { background: rgba(16, 185, 129, .07); border-color: rgba(16, 185, 129, .2); opacity: .85; }
        .item-row.taken:hover { opacity: 1; }
        .item-row.taken .item-text { text-decoration: line-through; color: var(--muted); }
        .item-row.taken .qty { background: rgba(16, 185, 129, .15); color: var(--emerald); }
        .item-row.taken .item-weight { opacity: .35; }

        .item-content { display: flex; align-items: flex-start; flex-grow: 1; gap: 8px; min-width: 0; pointer-events: none; }

        .qty { font-family: 'DM Mono', monospace; font-size: .68rem; font-weight: 500; color: var(--violet-h); background: rgba(139, 92, 246, .12); padding: 2px 6px; border-radius: 5px; min-width: 26px; text-align: center; flex-shrink: 0; margin-top: 2px; }
        .item-text { flex-grow: 2; font-size: .92rem; font-weight: 500; line-height: 1.45; word-break: break-word; }
        .item-weight { font-family: 'DM Mono', monospace; font-size: .58rem; color: var(--muted); flex-shrink: 0; background: var(--bg); padding: 1px 5px; border-radius: 5px; transition: color .2s; min-width: 34px; margin-top: 2px; }
        .item-row:hover .item-weight { color: var(--subtle); }

        .badge { font-size: .62rem; margin-left: 1px; cursor: help; opacity: .75; }

        .item-actions { display: flex; gap: 3px; align-items: center; margin-left: 5px; position: relative; z-index: 10; flex-shrink: 0; margin-top: 2px; pointer-events: auto; }

        .ia-btn {
            border: none;
            background: none;
            cursor: pointer;
            font-size: .9rem;
            padding: 4px;
            border-radius: 6px;
            opacity: 1;
            transition: background .15s, transform .15s;
            min-width: 28px;
            min-height: 28px;
            display: flex;
            align-items: center;
            justify-content: center;
            flex-shrink: 0;
            position: relative;
            z-index: 11;
            pointer-events: auto;
            touch-action: manipulation;
        }

        .ia-btn:hover { transform: scale(1.05); }
        .ia-btn.worn:hover { background: rgba(245, 158, 11, .15); }
        .ia-btn.edit:hover { background: rgba(90, 103, 242, .15); }
        .ia-btn.settings:hover { background: rgba(139, 92, 246, .15); }
        .ia-btn.del:hover { background: rgba(244, 63, 94, .15); }
        .ia-btn.del { color: var(--rose); }

        .btn-icon {
            border: none;
            background: var(--surface2);
            cursor: pointer;
            font-size: 1rem;
            padding: 4px 8px;
            border-radius: 6px;
            transition: all .15s;
            min-width: 32px;
            min-height: 32px;
            display: flex;
            align-items: center;
            justify-content: center;
            flex-shrink: 0;
            touch-action: manipulation;
        }

        .btn-icon:hover { transform: scale(1.05); background: var(--border2); }
        .btn-icon:active { transform: scale(0.95); }
        .btn-icon.btn-gear:hover { background: rgba(139, 92, 246, .2); }
        .btn-icon.btn-delete:hover { background: rgba(244, 63, 94, .2); }
        .btn-icon.btn-qty:hover { background: rgba(90, 103, 242, .2); }


        /* ─── ADD CUSTOM ────────────────────────────────────────── */
        .add-custom { display: flex; gap: 5px; margin-top: 8px; position: relative; z-index: 2; }
        .add-custom input { flex: 1; background: var(--bg); border: 1px solid var(--border); border-radius: 8px; padding: 7px 10px; font-size: .78rem; font-family: 'DM Sans', sans-serif; color: var(--text); transition: border-color .2s; }
        .add-custom input:focus { outline: none; border-color: var(--violet); }

        /* ─── EMPTY STATE ───────────────────────────────────────── */
        .empty-state { grid-column: 1 / -1; text-align: center; padding: 50px 16px; color: var(--muted); }
        .empty-state .es-icon { font-size: 2.7rem; opacity: .3; margin-bottom: 12px; }
        .empty-state p { font-size: .85rem; }

        /* ─── FAB MENU ──────────────────────────────────────────── */
        .fab-container {
            position: fixed;
            bottom: calc(var(--safe-bottom) + 20px);
            right: calc(var(--safe-right) + 20px);
            z-index: 100;
            display: flex;
            flex-direction: column;
            align-items: flex-end;
            gap: 10px;
            pointer-events: none;
            width: 52px;
            max-width: 220px;
        }

        .fab-menu {
            position: absolute;
            right: 0;
            bottom: 62px;
            background: var(--surface);
            border: 1px solid var(--border2);
            border-radius: var(--r-lg);
            padding: 7px;
            display: flex;
            flex-direction: column;
            gap: 7px;
            box-shadow: 0 10px 40px rgba(0, 0, 0, 0.5);
            opacity: 0;
            visibility: hidden;
            pointer-events: none;
            transform: translateY(20px) scale(0.95);
            transition: opacity 0.2s ease, transform 0.2s cubic-bezier(0.175, 0.885, 0.32, 1.275), visibility 0.2s ease;
            transform-origin: bottom right;
            min-width: 180px;
            max-height: min(72dvh, 620px);
            overflow-y: auto;
            overscroll-behavior: contain;
            scrollbar-width: thin;
            z-index: 110;
        }

        .fab-menu.open { opacity: 1; visibility: visible; pointer-events: auto; transform: translateY(0) scale(1); }

        .fab-item {
            display: flex;
            align-items: center;
            gap: 8px;
            padding: 9px 10px;
            border-radius: var(--r-sm);
            color: var(--text);
            font-size: 0.85rem;
            font-weight: 500;
            cursor: pointer;
            transition: background 0.2s;
            border: none;
            background: transparent;
            width: 100%;
            text-align: left;
            font-family: 'DM Sans', sans-serif;
            z-index: 111;
            position: relative;
            pointer-events: auto;
            user-select: none;
            touch-action: manipulation;
        }

        .fab-item:hover { background: var(--surface2); }
        .fab-item.active-filter { background: rgba(139, 92, 246, 0.15); color: var(--violet-h); }
        .fab-item-icon { font-size: 1.05rem; width: 22px; text-align: center; }

        .fab-main {
            width: 52px;
            height: 52px;
            border-radius: 50%;
            border: none;
            cursor: pointer;
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 1.4rem;
            box-shadow: 0 4px 20px rgba(90, 103, 242, 0.4);
            transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
            background: linear-gradient(135deg, var(--indigo), var(--violet));
            color: white;
            z-index: 101;
            position: relative;
            pointer-events: auto;
            user-select: none;
            touch-action: manipulation;
            -webkit-tap-highlight-color: transparent;
        }

        .fab-main:hover { transform: scale(1.05); }
        .fab-main.open { transform: rotate(90deg) scale(1.1); background: var(--rose); }
        .fab-main:active { transform: scale(0.95); }

        /* ─── OFFLINE INDICATOR ─────────────────────────────────── */
        .offline-bar {
            display: none;
            background: rgba(245, 158, 11, 0.1);
            border: 1px solid rgba(245, 158, 11, 0.3);
            border-radius: var(--r-sm);
            padding: 8px 14px;
            font-size: .72rem;
            font-weight: 600;
            color: var(--amber);
            text-align: center;
            margin-bottom: 10px;
        }

        .offline-bar.visible { display: block; }

        /* ─── TOAST ─────────────────────────────────────────────── */
        .toast {
            position: fixed;
            bottom: calc(var(--safe-bottom) + 85px);
            left: 50%;
            transform: translateX(-50%);
            background: var(--surface2);
            color: var(--text);
            padding: 10px 16px;
            border-radius: var(--r-sm);
            font-size: .8rem;
            font-weight: 600;
            box-shadow: 0 8px 28px rgba(0, 0, 0, .4);
            z-index: 1000;
            animation: rowIn .25s ease;
            border: 1px solid var(--border2);
            max-width: 90%;
            cursor: pointer;
            line-height: 1.3;
            text-align: center;
        }

        @keyframes rowIn { from { opacity: 0; transform: translateX(-50%) translateY(16px); } to { opacity: 1; transform: translateX(-50%) translateY(0); } }

        .toast.success { border-color: var(--emerald); }
        .toast.error { border-color: var(--rose); background: rgba(244, 63, 94, .12); }
        .toast.warning { border-color: var(--amber); background: rgba(245, 158, 11, .1); color: var(--amber); }
        .toast.undo { border-color: var(--violet); background: rgba(139, 92, 246, .15); }
        .toast-notification { position: fixed; bottom: calc(var(--safe-bottom) + 85px); left: 50%; z-index: 10000; max-width: min(90vw, 460px); padding: 11px 16px; transform: translateX(-50%); border: 1px solid var(--border2); border-radius: var(--r-sm); background: var(--surface2); color: var(--text); box-shadow: 0 8px 28px rgba(0,0,0,.4); font-size: .8rem; font-weight: 700; text-align: center; }

        /* ─── RESPONSIVE ────────────────────────────────────────── */
        @media (max-width: 480px) {
            .setup-grid { grid-template-columns: 1fr; }
            .activity-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
            .weather-btn { font-size: .68rem; padding: 7px 4px; }
            .stats-chips { gap: 5px; }
            .stats-top { align-items: stretch; }
            .stats-chips { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); width: 100%; }
            .stats-chips .chip { justify-content: center; min-width: 0; }
            .stats-chips .pct-display { grid-column: 1/-1; width: 100%; text-align: center; }
            .pct-display { font-size: 1.15rem !important; }
            .item-text { font-size: .88rem; }
            .qty { min-width: 24px; padding: 1px 5px; }
            .item-weight { min-width: 30px; font-size: .55rem; }
            .item-row { padding: 8px 7px; margin-bottom: 2px; }
            .cat-box { padding: 12px; }
            .cat-header { margin-bottom: 8px; }
            .fab-main { width: 48px; height: 48px; font-size: 1.2rem; }
            .fab-item { padding: 8px 9px; font-size: .8rem; }
        }

        /* ─── REDUCED MOTION ────────────────────────────────────── */
        @media (prefers-reduced-motion: reduce) {
            *, *::before, *::after { animation-duration: 0.01ms !important; transition-duration: 0.01ms !important; }
        }

/* Modern item controls and compact metadata */
.item-row { align-items: center; gap: 8px; padding: 10px 9px; }
.item-content { align-items: center; gap: 9px; min-width: 0; }
.item-main { display: flex; flex: 1; flex-direction: column; min-width: 0; gap: 3px; }
.item-text { display: block; width: 100%; font-size: .92rem; line-height: 1.35; }
.item-meta { display: flex; align-items: center; flex-wrap: wrap; gap: 5px; min-height: 16px; }
.item-weight { min-width: 0; margin: 0; padding: 0; background: none; color: var(--muted); font-size: .61rem; }
.item-badge { border-radius: 999px; padding: 1px 5px; font-size: .55rem; font-weight: 700; letter-spacing: .02em; }
.worn-badge { background: rgba(245,158,11,.14); color: #fbbf24; }
.bulky-badge { background: rgba(34,211,238,.12); color: var(--cyan); }
.custom-badge { background: rgba(139,92,246,.14); color: var(--violet-h); }
.item-actions { margin: 0; gap: 5px; }
.ia-btn { display: grid; place-items: center; width: 32px; height: 32px; padding: 7px; border: 1px solid var(--border); border-radius: 9px; background: transparent; color: var(--subtle); }
.ia-btn svg, .fab-item-icon svg { width: 100%; height: 100%; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.ia-btn.options:hover { color: var(--violet-h); background: rgba(139,92,246,.12); border-color: rgba(139,92,246,.3); }
.ia-btn.del { color: var(--rose); border-color: transparent; }
.ia-btn.del:hover { background: rgba(244,63,94,.12); border-color: rgba(244,63,94,.25); }

.update-banner { display: none; align-items: center; gap: 10px; margin-bottom: 12px; padding: 10px 12px; border: 1px solid rgba(34,211,238,.28); border-radius: var(--r-sm); background: linear-gradient(135deg, rgba(34,211,238,.12), rgba(139,92,246,.12)); }
.update-banner.visible { display: flex; }
.update-banner-icon { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 50%; background: rgba(34,211,238,.15); color: var(--cyan); font-size: 1.2rem; }
.update-banner-text { display: flex; flex: 1; flex-direction: column; font-size: .78rem; }
.update-banner-text small { color: var(--muted); }

.modal-backdrop { position: fixed; inset: 0; z-index: 2000; display: grid; place-items: center; padding: 16px; background: rgba(3,7,18,.72); opacity: 0; visibility: hidden; transition: .18s ease; backdrop-filter: blur(7px); }
.modal-backdrop.visible { opacity: 1; visibility: visible; }
.item-options-card { width: min(100%, 390px); padding: 18px; border: 1px solid var(--border2); border-radius: 18px; background: var(--surface); box-shadow: 0 24px 70px rgba(0,0,0,.42); transform: translateY(10px); transition: .18s ease; }
.modal-backdrop.visible .item-options-card { transform: translateY(0); }
.item-options-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; margin-bottom: 14px; }
.item-options-head h2 { margin: 3px 0 0; font-size: 1.12rem; }
.modal-close { width: 32px; height: 32px; border: 1px solid var(--border); border-radius: 9px; background: transparent; color: var(--muted); font-size: 1.3rem; cursor: pointer; }
.option-field { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 13px 0; border-top: 1px solid var(--border); }
.option-field span { display: flex; flex-direction: column; font-size: .82rem; }
.option-field small { margin-top: 2px; color: var(--muted); font-size: .66rem; }
.option-field input[type="number"] { width: 74px; padding: 8px; border: 1px solid var(--border2); border-radius: 9px; background: var(--bg); color: var(--text); text-align: center; }
.modern-switch { width: 42px; height: 23px; accent-color: var(--violet); }
.modal-actions { display: flex; justify-content: flex-end; gap: 8px; padding-top: 14px; border-top: 1px solid var(--border); }
.btn-secondary { border: 1px solid var(--border2); border-radius: 8px; padding: 7px 11px; background: transparent; color: var(--subtle); cursor: pointer; }
.fab-item-icon svg { width: 19px; height: 19px; }

@media (max-width: 480px) {
    .item-row { padding: 9px 6px; }
    .ia-btn { width: 30px; height: 30px; padding: 6px; }
    .update-banner { align-items: flex-start; flex-wrap: wrap; }
    .update-banner .btn-sm { margin-left: 40px; }
}

/* Item option inputs: override the global appearance reset for accessible controls. */
.option-field > input[type="number"], .weight-input-wrap input[type="number"] {
    width: 74px;
    padding: 8px;
    border: 1px solid var(--border2);
    border-radius: 9px;
    background: var(--bg);
    color: var(--text);
    text-align: center;
    appearance: auto;
    -webkit-appearance: auto;
}
.weight-input-wrap { display: flex !important; flex-direction: row !important; align-items: center; gap: 6px; color: var(--muted); font-size: .7rem; }
.modern-switch {
    position: relative;
    flex: 0 0 auto;
    width: 44px;
    height: 24px;
    border: 1px solid var(--border2);
    border-radius: 999px;
    background: var(--bg);
    cursor: pointer;
    appearance: none;
    -webkit-appearance: none;
    transition: background .2s, border-color .2s;
}
.modern-switch::after {
    content: '';
    position: absolute;
    top: 3px;
    left: 3px;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background: var(--subtle);
    transition: transform .2s, background .2s;
}
.modern-switch:checked { border-color: var(--violet-h); background: rgba(139,92,246,.4); }
.modern-switch:checked::after { transform: translateX(20px); background: #fff; }


/* Multi-bagaglio */
.list-grid { display: block; }
.baggage-section { margin: 0 0 18px; padding: 14px; border: 1px solid var(--border2); border-radius: var(--r-lg); background: linear-gradient(145deg, rgba(17,24,39,.98), rgba(11,15,26,.98)); }
.baggage-section.over-limit { border-color: rgba(244,63,94,.75); box-shadow: 0 0 0 1px rgba(244,63,94,.2); }
.baggage-header { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin-bottom: 12px; padding: 2px 4px 12px; border-bottom: 1px solid var(--border); }
.baggage-header h2 { font-size: 1rem; color: var(--text); }
.baggage-kicker { display: block; color: var(--subtle); font-size: .6rem; font-weight: 800; letter-spacing: 1px; text-transform: uppercase; }
.baggage-weight { flex: 0 0 auto; padding: 7px 10px; border: 1px solid rgba(16,185,129,.35); border-radius: 999px; background: rgba(16,185,129,.1); color: var(--emerald); font-family: 'DM Mono', monospace; font-size: .74rem; font-weight: 800; }
.baggage-weight small { color: inherit; opacity: .75; }
.baggage-weight.over-limit { border-color: rgba(244,63,94,.5); background: rgba(244,63,94,.12); color: var(--rose); }
.baggage-section .cat-box { margin-bottom: 10px; }
.option-field select, .baggage-manage-actions select { min-width: 145px; padding: 8px; border: 1px solid var(--border2); border-radius: 9px; background: var(--bg); color: var(--text); }
.baggage-dialog { width: min(100%, 720px); max-height: min(88vh, 760px); overflow: auto; }
.quick-count { display: grid; grid-template-columns: repeat(4, 1fr); gap: 7px; margin-bottom: 12px; }
.quick-count button { padding: 10px; border: 1px solid var(--border2); border-radius: 10px; background: var(--bg); color: var(--text); cursor: pointer; }
.baggage-count-label, .baggage-name-fields label, .baggage-manage-fields label { display: flex; flex-direction: column; gap: 4px; color: var(--subtle); font-size: .68rem; font-weight: 700; }
.baggage-count-label input, .baggage-name-fields input, .baggage-manage-fields input { padding: 9px; border: 1px solid var(--border2); border-radius: 9px; background: var(--bg); color: var(--text); }
.baggage-name-fields { display: grid; gap: 8px; margin-top: 12px; }
.baggage-manager-rows { display: grid; gap: 10px; }
.baggage-guide { max-width: 560px; margin-top: 5px; color: var(--subtle); font-size: .7rem; line-height: 1.45; }
.baggage-manage-row { padding: 12px; border: 1px solid var(--border); border-radius: 12px; background: var(--bg); }
.baggage-manage-fields { display: grid; grid-template-columns: 1fr 110px; gap: 8px; }
.baggage-manage-meta { margin: 7px 0; color: var(--muted); font-size: .68rem; }
.baggage-manage-actions { display: flex; flex-wrap: wrap; gap: 6px; }
.btn-secondary.danger { color: var(--rose); border-color: rgba(244,63,94,.35); }
@media (max-width: 520px) { .baggage-section { padding: 9px; } .baggage-manage-fields { grid-template-columns: 1fr; } .baggage-header { align-items: flex-start; } }
.item-text mark { padding: 0 2px; border-radius: 3px; background: rgba(245,158,11,.3); color: #fde68a; }
.stats-summary-dialog { width: min(100%, 520px); }
.stats-summary-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 9px; margin-bottom: 16px; }
.stats-summary-grid div { display: grid; gap: 2px; padding: 12px; border: 1px solid var(--border); border-radius: 12px; background: var(--bg); }
.stats-summary-grid strong { color: var(--violet-h); font-size: 1.05rem; }
.stats-summary-grid span,.stats-summary-dialog li { color: var(--subtle); font-size: .72rem; }
.stats-summary-dialog ul { display: grid; gap: 5px; margin: 8px 0 0 18px; }
.generate-actions { display: grid; grid-template-columns: 1fr minmax(300px,.8fr); gap: 8px; }
.quick-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.share-quick { min-height: 48px; border-color: rgba(34,211,238,.35); color: var(--cyan); }
.export-pdf-quick { border-color: rgba(139,92,246,.42); color: var(--violet-h); }
.fab-more { border-top: 1px solid var(--border); padding-top: 5px; }
.fab-more summary { padding: 8px 10px; border-radius: var(--r-sm); color: var(--subtle); font-size: .78rem; font-weight: 800; cursor: pointer; list-style: none; }
.fab-more summary:hover { background: var(--surface2); color: var(--text); }
.fab-more > div { display: grid; gap: 5px; margin-top: 4px; }
.cat-box.complete { border-color: rgba(16,185,129,.55); background: linear-gradient(145deg,rgba(16,185,129,.08),var(--surface)); animation: categoryComplete .32s ease-out; }
.cat-box.complete .cat-count { background: rgba(16,185,129,.18); color: var(--emerald); }
@keyframes categoryComplete { 50% { transform: scale(1.012); box-shadow: 0 0 0 3px rgba(16,185,129,.12); } }
@media(max-width:650px){.generate-actions{grid-template-columns:1fr}.share-quick{min-height:42px}.gender-choice-grid{grid-template-columns:repeat(3,1fr)!important}}

/* Admin visuale */
.admin-open{border:1px solid var(--border2);border-radius:8px;background:transparent;color:var(--muted);padding:5px 8px;cursor:pointer}.admin-modal{position:fixed;inset:0;z-index:1000;padding:12px;background:rgba(3,7,18,.88);display:grid;place-items:center}.admin-panel{width:min(1100px,100%);max-height:96vh;display:flex;flex-direction:column;border:1px solid var(--border2);border-radius:var(--r-lg);background:var(--card);color:var(--text);overflow:hidden}.admin-panel header,.admin-save{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:14px;border-bottom:1px solid var(--border)}.admin-panel h2,.admin-panel h3{margin:0}.admin-panel small{color:var(--violet-h)}.admin-close{font-size:1.8rem;background:none;border:0;color:var(--text)}.admin-login,.admin-content{padding:16px;overflow:auto}.admin-login label{display:grid;gap:8px}.admin-login input,.admin-item input,.admin-item select,.admin-rule input,.admin-rule button,.admin-content textarea{min-height:42px;padding:8px;border:1px solid var(--border2);border-radius:8px;background:var(--bg);color:var(--text)}.admin-tabs{display:flex;gap:6px;padding:10px;overflow:auto}.admin-tabs button,.admin-content button{padding:9px;border:1px solid var(--border2);border-radius:8px;background:var(--bg);color:var(--text)}.admin-content details{margin-bottom:8px;border:1px solid var(--border);border-radius:10px}.admin-content summary{padding:12px;cursor:pointer}.admin-items{display:grid;gap:8px;padding:8px}.admin-item{display:grid;grid-template-columns:2fr 1.5fr repeat(5,minmax(70px,1fr)) auto auto;gap:6px}.admin-rule{display:flex;gap:8px;align-items:center;margin:8px 0}.admin-rule input{flex:1}.admin-danger{color:var(--rose)!important}.admin-content textarea{width:100%;min-height:76px;margin:6px 0}.admin-unsaved{padding:6px 14px;color:var(--muted)}.admin-unsaved.dirty{color:var(--amber)}.admin-save{border-top:1px solid var(--border);border-bottom:0}.admin-status{color:var(--emerald);font-size:.75rem}@media(max-width:800px){.admin-item{grid-template-columns:1fr 1fr}.admin-item input:first-child{grid-column:1/-1}.admin-rule{align-items:stretch;flex-direction:column}.admin-save{flex-wrap:wrap}.admin-status{order:3;width:100%}}

/* Admin UX v2: campi descrittivi, card responsive e navigazione più chiara */
.admin-panel{width:min(1180px,calc(100% - 24px));max-height:calc(100dvh - 24px);background:linear-gradient(180deg,var(--card),var(--bg));box-shadow:0 24px 80px rgba(0,0,0,.55)}
.admin-panel header{flex:0 0 auto;padding:18px 22px;background:rgba(11,15,26,.92)}.admin-panel header h2{font-size:1.35rem}.admin-close{cursor:pointer}.admin-topbar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 18px}.admin-search{display:flex;align-items:center;gap:8px;width:min(360px,100%);padding:0 12px;border:1px solid var(--border2);border-radius:10px;background:var(--bg)}.admin-search input{width:100%;min-height:40px;border:0;background:transparent;color:var(--text);outline:0}.admin-tabs{padding:0 18px 12px;border-bottom:1px solid var(--border)}.admin-tabs button{white-space:nowrap;cursor:pointer}.admin-tabs button.active{border-color:var(--violet-h);background:rgba(139,92,246,.18);color:#fff}.admin-content{padding:16px 18px 24px}.admin-help{margin:0 0 12px;color:var(--muted);font-size:.78rem}.admin-section{overflow:hidden;background:rgba(11,15,26,.58)}.admin-section summary{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:.9rem;font-weight:800}.admin-section summary b{padding:4px 8px;border-radius:99px;background:rgba(139,92,246,.14);color:var(--violet-h);font-size:.66rem}.admin-items{padding:10px;background:rgba(2,6,23,.35)}.admin-add{width:100%;padding:12px!important;border-style:dashed!important;color:var(--violet-h)!important;font-weight:800;cursor:pointer}.admin-item{display:block;padding:13px;border:1px solid var(--border);border-radius:13px;background:var(--card);box-shadow:0 5px 18px rgba(0,0,0,.12)}.admin-item-title{display:flex;align-items:baseline;gap:8px;margin-bottom:10px}.admin-item-title strong{font-size:.9rem}.admin-item-title span{color:var(--muted);font-size:.66rem}.admin-item-fields{display:grid;grid-template-columns:2fr 1.5fr repeat(2,1fr) 1fr 1.35fr 1.25fr 1.2fr;gap:8px}.admin-field{display:flex;min-width:0;flex-direction:column;gap:5px;color:var(--subtle);font-size:.62rem;font-weight:800;letter-spacing:.02em}.admin-field>span{min-height:28px}.admin-field small,.admin-toggle small{display:block;margin-top:2px;color:var(--muted);font-size:.55rem;font-weight:500}.admin-field input,.admin-field select,.admin-field textarea{width:100%;min-width:0;min-height:42px;padding:8px;border:1px solid var(--border2);border-radius:8px;background:var(--bg);color:var(--text)}.admin-unit{display:flex;align-items:center;border:1px solid var(--border2);border-radius:8px;background:var(--bg)}.admin-unit input{border:0!important}.admin-unit span{padding-right:9px;color:var(--muted);font-size:.7rem}.admin-toggle{display:flex;align-items:center;gap:8px;min-height:42px;margin-top:28px;padding:7px;border:1px solid var(--border2);border-radius:8px;color:var(--text);font-size:.65rem}.admin-toggle input{width:20px;height:20px;accent-color:var(--violet)}.admin-delete{margin-top:10px!important;border-color:rgba(244,63,94,.28)!important;color:var(--rose)!important;cursor:pointer}.admin-rule{padding:12px;border:1px solid var(--border);border-radius:12px;background:var(--card)}.admin-rule .admin-field{flex:1}.admin-warning{margin:10px 0}.admin-save{position:sticky;bottom:0;background:rgba(11,15,26,.96);backdrop-filter:blur(12px)}
@media(max-width:1050px){.admin-item-fields{grid-template-columns:repeat(4,1fr)}.admin-field>span{min-height:auto}.admin-toggle{margin-top:20px}}
@media(max-width:650px){.admin-modal{padding:0;place-items:stretch}.admin-panel{width:100%;max-height:100dvh;border:0;border-radius:0}.admin-panel header{padding:14px}.admin-topbar{align-items:stretch;flex-direction:column;padding:8px 12px}.admin-search{width:100%}.admin-tabs{padding:0 12px 9px}.admin-content{padding:10px}.admin-items{padding:7px}.admin-item{padding:11px}.admin-item-fields{grid-template-columns:1fr 1fr}.admin-field:first-child{grid-column:1/-1}.admin-toggle{margin-top:0}.admin-save{padding:10px}.admin-save .btn-sm{min-height:44px}.admin-rule{align-items:stretch;flex-direction:column}}

/* Admin UX v3: percorso lineare e feedback immediato delle modifiche */
.admin-field,.admin-toggle,.admin-rule{position:relative;transition:border-color .2s,background .2s,box-shadow .2s}.admin-field.is-modified>span:first-child,.admin-toggle.is-modified strong,.admin-rule.is-modified .admin-field>span:first-child{color:var(--amber)}.admin-field.is-modified input,.admin-field.is-modified select,.admin-field.is-modified textarea,.admin-toggle.is-modified,.admin-rule.is-modified{border-color:rgba(245,158,11,.72);background:rgba(245,158,11,.07);box-shadow:0 0 0 2px rgba(245,158,11,.08)}.admin-field.is-modified>span:first-child::after,.admin-toggle.is-modified strong::after{content:'  ● modificato';color:var(--amber);font-size:.52rem;font-weight:800}.admin-toggle input[type="checkbox"]{position:relative;display:grid;place-items:center;flex:0 0 24px;width:24px;height:24px;border:2px solid var(--border2);border-radius:7px;background:var(--bg);appearance:none;-webkit-appearance:none;cursor:pointer}.admin-toggle input[type="checkbox"]::after{content:'✓';color:#fff;font-size:16px;font-weight:900;line-height:1;opacity:0;transform:scale(.5);transition:opacity .15s,transform .15s}.admin-toggle input[type="checkbox"]:checked{border-color:var(--violet-h);background:var(--violet);box-shadow:0 0 0 3px rgba(139,92,246,.2)}.admin-toggle input[type="checkbox"]:checked::after{opacity:1;transform:scale(1)}.admin-login{width:min(520px,100%);margin:0 auto;padding:28px 20px}.admin-login label{color:var(--subtle);font-weight:800}.admin-login input{min-height:48px}.admin-login .btn-sm{width:100%;min-height:46px;margin-top:12px}.admin-item-fields{align-items:end}.admin-item-title{padding-bottom:8px;border-bottom:1px solid var(--border)}
@media(max-width:650px){.admin-panel header h2{font-size:1.2rem}.admin-item-title{align-items:flex-start;flex-direction:column}.admin-item-fields{grid-template-columns:1fr}.admin-field:first-child{grid-column:auto}.admin-field>span{min-height:auto}.admin-toggle{margin-top:2px;padding:12px}.admin-delete{width:100%;min-height:42px}.admin-save{gap:8px}.admin-save button{flex:1}.admin-save .admin-status{order:3;flex-basis:100%}}

/* Compatibilità trasporto per singolo item */
.admin-transport{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:7px;margin:4px 0 0;padding:10px;border:1px solid var(--border);border-radius:10px}.admin-transport legend{padding:0 5px;color:var(--subtle);font-size:.65rem;font-weight:800}.admin-transport legend small{margin-left:5px;color:var(--muted);font-weight:500}.admin-transport label{display:flex;align-items:center;gap:5px;padding:7px 9px;border:1px solid var(--border2);border-radius:999px;background:var(--bg);color:var(--subtle);font-size:.62rem;font-weight:800;cursor:pointer}.admin-transport input{width:16px;height:16px;accent-color:var(--violet)}.admin-transport label:has(input:checked){border-color:var(--violet-h);background:rgba(139,92,246,.16);color:#fff}@media(max-width:650px){.admin-transport{display:grid;grid-template-columns:1fr 1fr}.admin-transport legend small{display:block;margin:2px 0 0}.admin-transport label{border-radius:8px}}

/* Admin UX v4: accesso, stato, tab e regole quantità */
.admin-password{display:flex;align-items:center;border:1px solid var(--border2);border-radius:10px;background:var(--bg);overflow:hidden}.admin-password input{flex:1;border:0!important}.admin-password button{flex:0 0 48px;align-self:stretch;border:0;border-left:1px solid var(--border);background:transparent;color:var(--text);font-size:1rem;cursor:pointer}.admin-unsaved{display:inline-flex;align-items:center;min-height:30px;padding:5px 10px;border:1px solid var(--border);border-radius:999px;white-space:nowrap;font-size:.68rem;font-weight:800}.admin-unsaved.dirty{border-color:rgba(245,158,11,.45);background:rgba(245,158,11,.1);color:var(--amber)}.admin-unsaved.saved{border-color:rgba(16,185,129,.45);background:rgba(16,185,129,.1);color:var(--emerald)}.admin-tabs{display:grid;grid-template-columns:repeat(4,minmax(100px,1fr));gap:8px}.admin-tabs button{min-height:40px;font-weight:800}.admin-tabs button.active{box-shadow:inset 0 -3px 0 var(--violet-h),0 0 0 1px rgba(139,92,246,.25)}.admin-quantity{grid-column:1/-1;display:grid;grid-template-columns:repeat(5,minmax(100px,1fr)) minmax(180px,1.5fr);gap:8px;margin:4px 0 0;padding:10px;border:1px solid var(--border);border-radius:10px}.admin-quantity legend{padding:0 5px;color:var(--subtle);font-size:.65rem;font-weight:800}.admin-quantity legend small{margin-left:5px;color:var(--muted);font-weight:500}.admin-quantity .admin-toggle{margin-top:0}.input-box select#transport{min-height:38px;padding-block:6px}
@media(max-width:650px){.admin-tabs{grid-template-columns:repeat(2,1fr);padding:0 12px 10px}.admin-tabs button{min-height:44px}.admin-topbar{gap:8px}.admin-unsaved{align-self:flex-start;max-width:100%;overflow:hidden;text-overflow:ellipsis}.admin-quantity{grid-template-columns:1fr 1fr}.admin-quantity .admin-toggle{grid-column:1/-1}.admin-quantity legend small{display:block;margin:2px 0 0}.input-box select#transport{min-height:42px;font-size:.78rem}}

/* Admin UX v5: navigazione sempre visibile e chip trasporto senza re-render */
.admin-tabs{position:relative;z-index:3;flex:0 0 auto;display:flex!important;gap:8px;padding:10px 18px;border-block:1px solid var(--border);background:rgba(11,15,26,.98);overflow-x:auto;scrollbar-width:thin}.admin-tabs button{flex:1 0 120px;min-width:0;min-height:42px;padding:8px 14px!important;border:1px solid var(--border2)!important;border-radius:10px!important;background:var(--bg)!important;color:var(--subtle)!important;font-size:.72rem;font-weight:800;line-height:1.2;white-space:nowrap}.admin-tabs button.active{border-color:var(--violet-h)!important;background:rgba(139,92,246,.22)!important;color:#fff!important;box-shadow:inset 0 -3px 0 var(--violet-h)}.admin-transport{gap:6px;padding:9px}.admin-transport label{min-height:36px;padding:6px 10px;transition:border-color .15s,background .15s,color .15s}.admin-transport.is-modified{border-color:rgba(245,158,11,.55);background:rgba(245,158,11,.04)}@media(max-width:650px){.admin-tabs{gap:6px;padding:8px 10px}.admin-tabs button{flex-basis:auto;min-width:96px;min-height:40px;padding:7px 10px!important;font-size:.68rem}.admin-transport{display:flex;gap:6px}.admin-transport label{flex:1 0 auto;min-height:38px;padding:7px 9px}}

/* Meteo per singolo item: modificatore compatto, mai categoria */
.admin-weather{grid-column:1/-1;margin:4px 0 0;border:1px solid var(--border);border-radius:10px;background:rgba(2,6,23,.22)}.admin-weather summary{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:9px 11px;color:var(--subtle);font-size:.65rem;font-weight:800;cursor:pointer}.admin-weather summary b{max-width:70%;overflow:hidden;color:var(--violet-h);font-size:.6rem;text-overflow:ellipsis;white-space:nowrap}.admin-weather>div{display:flex;flex-wrap:wrap;gap:6px;padding:0 9px 9px}.admin-weather label{display:flex;align-items:center;gap:5px;min-height:34px;padding:5px 9px;border:1px solid var(--border2);border-radius:999px;background:var(--bg);color:var(--subtle);font-size:.6rem;font-weight:800;cursor:pointer}.admin-weather input{width:15px;height:15px;accent-color:var(--violet)}.admin-weather label:has(input:checked){border-color:var(--violet-h);background:rgba(139,92,246,.16);color:#fff}.admin-weather.is-modified{border-color:rgba(245,158,11,.55);background:rgba(245,158,11,.04)}@media(max-width:650px){.admin-weather summary{min-height:42px}.admin-weather>div{display:grid;grid-template-columns:1fr 1fr}.admin-weather label{border-radius:8px}}

/* Mezzi per singolo item: stesso pattern compatto ed espandibile del meteo */
.admin-transport{grid-column:1/-1;display:block;margin:4px 0 0;padding:0;border:1px solid var(--border);border-radius:10px;background:rgba(2,6,23,.22)}.admin-transport summary{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:9px 11px;color:var(--subtle);font-size:.65rem;font-weight:800;cursor:pointer}.admin-transport summary b{max-width:70%;overflow:hidden;color:var(--violet-h);font-size:.6rem;text-overflow:ellipsis;white-space:nowrap}.admin-transport>div{display:flex;flex-wrap:wrap;gap:6px;padding:0 9px 9px}.admin-transport label{min-height:34px;padding:5px 9px}.input-box select#transport[multiple]{height:76px;overflow:auto}@media(max-width:650px){.admin-transport summary{min-height:42px}.admin-transport>div{display:grid;grid-template-columns:1fr 1fr}.admin-transport label{border-radius:8px}.input-box select#transport[multiple]{height:70px}}

/* Selettori squadrati e coerenti tra app e pannello admin */
.visual-select-source{position:absolute!important;width:1px!important;height:1px!important;overflow:hidden!important;clip:rect(0 0 0 0)!important;white-space:nowrap!important}.choice-grid{display:grid;gap:6px;margin-top:5px}.gender-choice-grid{grid-template-columns:repeat(2,1fr)}.transport-choice-grid{grid-template-columns:repeat(3,1fr)}.choice-btn{min-height:40px;padding:7px 8px;border:1px solid var(--border2);border-radius:9px;background:var(--bg);color:var(--subtle);font-size:.66rem;font-weight:800;cursor:pointer;transition:border-color .16s,background .16s,color .16s,transform .16s}.choice-btn:active{transform:scale(.98)}.choice-btn.active{border-color:var(--violet-h);background:rgba(139,92,246,.2);color:#fff;box-shadow:inset 0 -2px 0 var(--violet-h)}.admin-transport label,.admin-weather label{border-radius:8px!important;background:rgba(11,15,26,.86)}.admin-transport label:has(input:checked),.admin-weather label:has(input:checked){box-shadow:inset 0 -2px 0 var(--violet-h)}.admin-transport input,.admin-weather input{border-radius:4px!important}@media(max-width:650px){.transport-choice-grid{grid-template-columns:repeat(2,1fr)}.choice-btn{min-height:42px;font-size:.68rem}.admin-transport>div,.admin-weather>div{gap:7px}.admin-transport label,.admin-weather label{min-height:40px}}

/* Comunicazioni locali, supporto e feedback */
.communication-banner{display:flex;align-items:center;gap:12px;margin:10px 0;padding:11px 13px;border:1px solid var(--border2);border-left:4px solid var(--violet-h);border-radius:12px;background:var(--card);color:var(--text)}.communication-banner>div{display:grid;flex:1;gap:2px;min-width:0}.communication-banner strong{font-size:.82rem}.communication-banner span{color:var(--subtle);font-size:.72rem}.communication-banner.warning{border-left-color:var(--amber)}.communication-banner.support{border-left-color:var(--emerald)}.communication-banner.update{border-left-color:var(--blue)}.communication-banner>button{border:0;background:transparent;color:var(--muted);font-size:1.35rem;cursor:pointer}.support-banner{background:linear-gradient(135deg,rgba(16,185,129,.09),var(--card))}.feedback-modal .item-options-card{width:min(520px,calc(100% - 24px));max-height:calc(100dvh - 24px);overflow:auto}.feedback-modal textarea{width:100%;min-height:120px;resize:vertical}.feedback-rating{display:grid;gap:5px;border:1px solid var(--border);border-radius:var(--r-sm);padding:12px;background:var(--bg)}.feedback-rating legend{padding:0 5px;color:var(--text);font-size:.8rem;font-weight:800}.feedback-rating small{color:var(--subtle);font-size:.68rem}.feedback-stars{display:flex;align-items:center;gap:7px}.feedback-stars button{display:grid;place-items:center;width:44px;height:44px;border:1px solid var(--border2);border-radius:11px;background:var(--surface2);color:var(--muted);font-size:1.65rem;cursor:pointer;transition:transform .15s,color .15s,border-color .15s,background .15s}.feedback-stars button:hover,.feedback-stars button:focus-visible,.feedback-stars button.selected{border-color:var(--amber);background:rgba(245,158,11,.12);color:var(--amber);transform:translateY(-1px)}.feedback-comment{align-items:stretch;flex-direction:column;gap:8px}.communication-note{padding:10px;border:1px solid rgba(245,158,11,.35);border-radius:10px;background:rgba(245,158,11,.08);color:var(--subtle);font-size:.72rem}.admin-communications form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-bottom:20px}.admin-communications form h3,.admin-communications form .btn-sm{grid-column:1/-1}.admin-feedback-actions{display:flex;flex-wrap:wrap;gap:8px;margin:10px 0}.admin-feedback-list{display:grid;gap:8px}.admin-feedback-list article{padding:11px;border:1px solid var(--border);border-radius:10px;background:var(--card)}.admin-feedback-list p{color:var(--subtle);font-size:.72rem}.admin-tabs button{flex-basis:130px}@media(max-width:650px){.communication-banner{align-items:flex-start;flex-wrap:wrap}.communication-banner .btn-sm{margin-left:auto}.admin-communications form{grid-template-columns:1fr}.admin-tabs button{flex-basis:112px}.feedback-modal .item-options-card{width:calc(100% - 16px)}.feedback-stars{justify-content:space-between;gap:4px}.feedback-stars button{width:min(44px,17vw);height:min(44px,17vw)}}

/* Backend Apps Script nella tab Comunicazioni */
.apps-script-admin{margin:18px 0;padding:14px;border:1px solid var(--border2);border-radius:12px;background:rgba(2,6,23,.28)}.apps-script-admin form{margin:12px 0}.admin-remote-status{min-height:22px;margin:8px 0;color:var(--violet-h);font-size:.72rem;font-weight:800}.apps-script-admin input[type="password"]{font-family:monospace}@media(max-width:650px){.apps-script-admin{padding:10px}.apps-script-admin .admin-feedback-actions{display:grid;grid-template-columns:1fr}.apps-script-admin .admin-feedback-actions button{min-height:42px}}

/* UX polish v1.10.14: controlli più coerenti e admin compatto */
.card,
.cat-box,
.stats-bar,
.item-options-card,
.admin-panel {
    border-color: rgba(148, 163, 184, .18);
    box-shadow: 0 18px 50px rgba(0, 0, 0, .24);
}
.input-box,
.template-row,
.toggle-group {
    border: 1px solid rgba(148, 163, 184, .14);
    border-radius: var(--r-md);
    background: rgba(15, 23, 42, .48);
}
.input-box { padding: 12px; }
.setup-grid { gap: 12px; }
.btn-main,
.btn-sm,
.btn-secondary,
.fab-item,
.admin-tabs button,
.admin-add,
.admin-delete {
    border-radius: 12px !important;
    transition: transform .16s ease, border-color .16s ease, background .16s ease, box-shadow .16s ease;
}
.btn-main:hover,
.btn-sm:hover,
.btn-secondary:hover,
.fab-item:hover,
.admin-tabs button:hover,
.admin-add:hover { transform: translateY(-1px); }
.setup-warning {
    display: none;
    margin: 0 0 10px;
    padding: 11px 13px;
    border: 1px solid rgba(245, 158, 11, .38);
    border-radius: 14px;
    background: linear-gradient(135deg, rgba(245, 158, 11, .14), rgba(139, 92, 246, .08));
    color: #fde68a;
    font-size: .78rem;
    font-weight: 800;
}
.setup-warning.visible { display: block; }
.share-quick {
    display: grid;
    grid-template-columns: auto 1fr;
    align-items: center;
    column-gap: 8px;
    min-height: 54px;
    text-align: left;
    background: linear-gradient(135deg, rgba(34, 211, 238, .16), rgba(139, 92, 246, .18));
    box-shadow: inset 0 0 0 1px rgba(34, 211, 238, .18), 0 10px 24px rgba(34, 211, 238, .08);
}
.share-quick span { grid-row: 1 / span 2; font-size: 1.15rem; }
.share-quick strong { line-height: 1; }
.share-quick small { color: var(--subtle); font-size: .62rem; font-weight: 700; }
.admin-item {
    display: block !important;
    padding: 0 !important;
    overflow: hidden;
    border-radius: 14px !important;
    background: rgba(15, 23, 42, .78) !important;
}
.admin-item-title {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto auto;
    align-items: center !important;
    gap: 10px !important;
    margin: 0 !important;
    padding: 12px 13px !important;
    border: 0 !important;
    cursor: pointer;
    list-style: none;
}
.admin-item-title::-webkit-details-marker { display: none; }
.admin-item-title span { display: grid; min-width: 0; gap: 2px; }
.admin-item-title strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.admin-item-title small { color: var(--subtle); font-size: .64rem; }
.admin-item-title em {
    padding: 4px 8px;
    border: 1px solid var(--border);
    border-radius: 999px;
    color: var(--muted);
    font-size: .6rem;
    font-style: normal;
    white-space: nowrap;
}
.admin-item-title i { color: var(--violet-h); transition: transform .18s ease; }
.admin-item[open] .admin-item-title i { transform: rotate(180deg); }
.admin-item-fields {
    padding: 0 13px 13px;
    animation: adminFieldsIn .18s ease-out;
}
@keyframes adminFieldsIn { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: translateY(0); } }
.admin-delete { justify-self: start; }
@media(max-width:650px){
    .input-box { padding: 10px; }
    .share-quick { min-height: 48px; grid-template-columns: auto 1fr; }
    .admin-item-title { grid-template-columns: minmax(0, 1fr) auto; }
    .admin-item-title em { display: none; }
}

body {
    background-color: var(--bg-deep);
    background-image:
        radial-gradient(circle at 18% -8%, rgba(90, 103, 242, .16), transparent 34rem),
        radial-gradient(circle at 88% 8%, rgba(139, 92, 246, .12), transparent 30rem),
        linear-gradient(180deg, rgba(15, 23, 42, .38), rgba(3, 7, 18, 0) 34rem);
}

.app-header {
    position: relative;
    padding: 8px 8px 14px;
    border-bottom: 1px solid rgba(148, 163, 184, .08);
}
.app-logo-icon {
    border: 1px solid rgba(255, 255, 255, .16);
    box-shadow: 0 12px 28px rgba(90, 103, 242, .26), inset 0 1px 0 rgba(255, 255, 255, .2);
}
.app-version {
    color: var(--text-soft);
    background: rgba(15, 23, 42, .78);
    border-color: rgba(148, 163, 184, .2);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .05);
}

.card,
.stats-bar,
.cat-box,
.item-options-card,
.admin-panel,
.communication-banner {
    background: linear-gradient(145deg, rgba(17, 24, 39, .88), rgba(8, 13, 24, .94));
    border: 1px solid var(--line-soft);
    box-shadow: var(--shadow-soft), inset 0 1px 0 rgba(255, 255, 255, .04);
    backdrop-filter: blur(14px);
}
.card { padding: 18px; }
.section-label { color: var(--text-strong); letter-spacing: .015em; }
.input-box,
.template-row,
.toggle-group,
.laundry-freq {
    background: linear-gradient(145deg, rgba(15, 23, 42, .7), rgba(8, 13, 24, .72));
    border-color: rgba(148, 163, 184, .14);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .035);
}
.input-box label,
.toggle-text-main { color: var(--text-strong); }
.toggle-text-sub,
.input-box small { color: var(--text-soft); }

.btn-main,
.btn-sm,
.btn-secondary,
.admin-tabs button,
.admin-content button,
.fab-item,
.fab-main,
.choice-btn,
.weather-btn,
.activity-grid > .act-btn {
    min-height: 44px;
    border-radius: 14px !important;
    transition: transform var(--motion-fast) var(--ease-premium), border-color var(--motion-fast) var(--ease-premium), background var(--motion-fast) var(--ease-premium), box-shadow var(--motion-fast) var(--ease-premium), color var(--motion-fast) var(--ease-premium);
}
.btn-main,
.btn-sm:not(.danger) {
    box-shadow: 0 12px 28px rgba(90, 103, 242, .2), inset 0 1px 0 rgba(255, 255, 255, .16);
}
.btn-secondary,
.fab-item,
.choice-btn,
.weather-btn,
.activity-grid > .act-btn {
    background: rgba(15, 23, 42, .72);
    border-color: rgba(148, 163, 184, .18);
    color: var(--text-soft);
}
.btn-main:hover,
.btn-sm:hover,
.btn-secondary:hover,
.fab-item:hover,
.choice-btn:hover,
.weather-btn:hover,
.activity-grid > .act-btn:hover { transform: translateY(-2px); }
.btn-main:active,
.btn-sm:active,
.btn-secondary:active,
.fab-item:active,
.choice-btn:active,
.weather-btn:active,
.activity-grid > .act-btn:active { transform: translateY(0) scale(.985); }
button:disabled,
.btn-main:disabled,
.btn-sm:disabled,
.btn-secondary:disabled { opacity: .55; cursor: not-allowed; transform: none !important; }
.choice-btn.active,
.weather-btn.active,
.activity-grid > .act-btn.active {
    color: var(--text-strong);
    border-color: var(--line-strong);
    background: linear-gradient(145deg, rgba(90, 103, 242, .2), rgba(139, 92, 246, .16));
    box-shadow: 0 14px 30px rgba(90, 103, 242, .14), inset 0 0 0 1px rgba(255, 255, 255, .05);
}

.share-quick {
    justify-content: start;
    border-color: rgba(139, 92, 246, .32) !important;
    color: var(--text-strong) !important;
    background: linear-gradient(135deg, rgba(90, 103, 242, .24), rgba(139, 92, 246, .18)) !important;
    box-shadow: 0 16px 38px rgba(90, 103, 242, .16), inset 0 1px 0 rgba(255, 255, 255, .08) !important;
}
.share-quick span {
    display: grid;
    place-items: center;
    width: 34px;
    height: 34px;
    border-radius: 12px;
    background: rgba(255, 255, 255, .08);
}

.fab-main {
    border: 1px solid rgba(255, 255, 255, .16);
    background: linear-gradient(135deg, var(--accent-2), var(--accent));
    box-shadow: 0 18px 44px rgba(90, 103, 242, .28), inset 0 1px 0 rgba(255, 255, 255, .18);
}
.fab-menu {
    border: 1px solid var(--line-soft);
    border-radius: 18px;
    background: rgba(8, 13, 24, .94);
    box-shadow: var(--shadow-elevated);
    transform-origin: bottom right;
    transition: opacity var(--motion-med) var(--ease-premium), transform var(--motion-med) var(--ease-premium), visibility var(--motion-med) var(--ease-premium);
}
.fab-menu:not(.open) { opacity: 0; transform: translateY(10px) scale(.97); visibility: hidden; }
.fab-menu.open { opacity: 1; transform: translateY(0) scale(1); visibility: visible; }
.fab-item { justify-content: flex-start; gap: 10px; }
.fab-item-icon { display: inline-grid; place-items: center; width: 26px; }

.admin-panel {
    background: linear-gradient(145deg, rgba(15, 23, 42, .96), rgba(3, 7, 18, .98));
    box-shadow: var(--shadow-elevated);
}
.admin-panel header,
.admin-save,
.admin-tabs {
    background: rgba(7, 11, 20, .82) !important;
    backdrop-filter: blur(16px);
}
.admin-search {
    min-height: 46px;
    border-color: rgba(148, 163, 184, .2) !important;
    border-radius: 14px !important;
    background: rgba(15, 23, 42, .78) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .04);
}
.admin-tabs button {
    color: var(--text-soft) !important;
    border-color: rgba(148, 163, 184, .16) !important;
    background: rgba(15, 23, 42, .72) !important;
}
.admin-tabs button.active {
    color: var(--text-strong) !important;
    border-color: rgba(139, 92, 246, .42) !important;
    background: linear-gradient(145deg, rgba(90, 103, 242, .24), rgba(139, 92, 246, .14)) !important;
}
.admin-item {
    contain: layout paint;
    border-color: rgba(148, 163, 184, .18) !important;
    background: linear-gradient(145deg, rgba(17, 24, 39, .88), rgba(10, 15, 28, .92)) !important;
    box-shadow: 0 10px 30px rgba(0, 0, 0, .22), inset 0 1px 0 rgba(255, 255, 255, .045);
    transition: border-color var(--motion-med) var(--ease-premium), box-shadow var(--motion-med) var(--ease-premium), transform var(--motion-fast) var(--ease-premium);
}
.admin-item:hover,
.admin-item:focus-within {
    border-color: rgba(167, 139, 250, .38) !important;
    box-shadow: 0 16px 44px rgba(0, 0, 0, .3), inset 0 1px 0 rgba(255, 255, 255, .06);
}
.admin-item-title { min-height: 58px; }
.admin-item-title strong { color: var(--text-strong); font-size: .94rem; letter-spacing: -.01em; }
.admin-item-title small { color: var(--text-soft); font-weight: 800; }
.admin-item-title em {
    color: #dbeafe;
    border-color: rgba(148, 163, 184, .2);
    background: rgba(15, 23, 42, .72);
}
.admin-item-title i {
    display: grid;
    place-items: center;
    width: 42px;
    height: 42px;
    border: 1px solid rgba(255, 255, 255, .14);
    border-radius: 14px;
    background: rgba(2, 6, 23, .86);
    color: #f8fafc !important;
    font-size: 1.08rem;
    line-height: 1;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .06);
    transition: transform var(--motion-med) var(--ease-premium), background var(--motion-fast) var(--ease-premium), border-color var(--motion-fast) var(--ease-premium);
}
.admin-item-title:hover i { border-color: rgba(255, 255, 255, .24); background: rgba(15, 23, 42, .96); }
.admin-item[open] .admin-item-title i { transform: rotate(180deg); }
.admin-item-fields {
    border-top: 1px solid rgba(148, 163, 184, .1);
    background: rgba(2, 6, 23, .18);
    animation: adminFieldsIn var(--motion-med) var(--ease-premium);
}
.admin-save {
    padding-bottom: calc(12px + var(--safe-bottom));
    box-shadow: 0 -18px 38px rgba(0, 0, 0, .2);
}
.admin-unsaved.saved { animation: savedPulse 650ms var(--ease-premium); }

.setup-warning.visible { animation: noticeIn var(--motion-med) var(--ease-premium); }
.modal-backdrop.visible,
.admin-modal { animation: modalIn var(--motion-med) var(--ease-premium); }
@keyframes savedPulse { 50% { transform: translateY(-1px); box-shadow: 0 0 0 4px rgba(16, 185, 129, .12); } }
@keyframes noticeIn { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: translateY(0); } }
@keyframes modalIn { from { opacity: 0; } to { opacity: 1; } }

@media (max-width: 650px) {
    body { padding-inline: 10px; }
    .card { padding: 14px; border-radius: 20px; }
    .setup-grid { gap: 10px; }
    .admin-panel { max-height: 100dvh; }
    .admin-save { gap: 8px; }
    .admin-item-title { min-height: 62px; padding: 10px !important; }
    .admin-item-title i { width: 44px; height: 44px; border-radius: 14px; }
    .fab-menu { max-height: min(72dvh, 520px); overflow: auto; }
}

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        scroll-behavior: auto !important;
        transition-duration: .01ms !important;
    }
}

.card,
.stats-bar,
.cat-box,
.item-options-card,
.admin-panel,
.communication-banner {
    backdrop-filter: blur(8px);
}

.btn-main,
.btn-sm,
.btn-secondary,
.admin-tabs button,
.admin-content button,
.fab-item,
.fab-main,
.choice-btn,
.weather-btn,
.activity-grid > .act-btn,
.admin-item {
    transition-property: transform, border-color, background, color, opacity;
    transition-duration: var(--motion-fast);
    transition-timing-function: var(--ease-premium);
}

.btn-main:hover,
.btn-sm:hover,
.btn-secondary:hover,
.fab-item:hover,
.choice-btn:hover,
.weather-btn:hover,
.activity-grid > .act-btn:hover { transform: translateY(-1px); }

.fab-menu {
    transition-duration: var(--motion-med);
}
.fab-menu:not(.open) { transform: translateY(6px) scale(.985); }

.admin-item {
    box-shadow: 0 8px 22px rgba(0, 0, 0, .22), inset 0 1px 0 rgba(255, 255, 255, .04);
}
.admin-item:hover,
.admin-item:focus-within {
    box-shadow: 0 12px 30px rgba(0, 0, 0, .28), inset 0 1px 0 rgba(255, 255, 255, .055);
}
.admin-item-fields {
    animation-duration: 120ms;
}

.admin-item-title i {
    position: relative;
    font-size: 0;
    width: 44px;
    height: 44px;
    border-radius: 13px;
    background: linear-gradient(145deg, rgba(15, 23, 42, .98), rgba(2, 6, 23, .98));
    transition: transform 140ms var(--ease-premium), border-color 95ms var(--ease-premium), background 95ms var(--ease-premium);
}
.admin-item-title i::before {
    content: '';
    width: 10px;
    height: 10px;
    border-right: 2px solid #f8fafc;
    border-bottom: 2px solid #f8fafc;
    transform: translateY(-2px) rotate(45deg);
}
.admin-item[open] .admin-item-title i { transform: rotate(180deg); }

.setup-warning.visible,
.modal-backdrop.visible,
.admin-modal { animation-duration: 130ms; }
.admin-unsaved.saved { animation-duration: 420ms; }

.card,
.stats-bar,
.cat-box,
.item-options-card,
.admin-panel,
.communication-banner,
.admin-panel header,
.admin-save,
.admin-tabs {
    backdrop-filter: none !important;
}

.btn-main,
.btn-sm,
.btn-secondary,
.admin-tabs button,
.admin-content button,
.fab-item,
.fab-main,
.choice-btn,
.weather-btn,
.activity-grid > .act-btn,
.admin-item,
.share-quick {
    transition: border-color 60ms linear, background-color 60ms linear, color 60ms linear, opacity 60ms linear !important;
}

.btn-main:hover,
.btn-sm:hover,
.btn-secondary:hover,
.fab-item:hover,
.choice-btn:hover,
.weather-btn:hover,
.activity-grid > .act-btn:hover,
.admin-add:hover,
.admin-tabs button:hover {
    transform: none !important;
}

.btn-main:active,
.btn-sm:active,
.btn-secondary:active,
.fab-item:active,
.choice-btn:active,
.weather-btn:active,
.activity-grid > .act-btn:active {
    transform: scale(.995) !important;
}

.fab-menu,
.fab-menu.open,
.fab-menu:not(.open) {
    transition: opacity 80ms linear, visibility 80ms linear !important;
    transform: none !important;
}

.admin-item,
.admin-item:hover,
.admin-item:focus-within {
    box-shadow: 0 8px 20px rgba(0, 0, 0, .22), inset 0 1px 0 rgba(255, 255, 255, .04);
}
.admin-item-fields,
.setup-warning.visible,
.modal-backdrop.visible,
.admin-modal,
.admin-unsaved.saved {
    animation: none !important;
}
.admin-item-title i {
    transition: transform 90ms linear, border-color 60ms linear, background-color 60ms linear !important;
}

/* v1.10.14: chevron admin uniforme su sezioni e item, senza riquadro */
.admin-section summary {
    display: grid !important;
    grid-template-columns: 1fr auto auto;
    align-items: center;
    gap: 12px;
}
.admin-section summary::after {
    content: '';
    width: 11px;
    height: 11px;
    margin-inline: 4px 2px;
    border-right: 2px solid #e8edf5;
    border-bottom: 2px solid #e8edf5;
    opacity: .9;
    transform: translateY(-2px) rotate(45deg);
    transition: transform 90ms linear, opacity 60ms linear;
}
.admin-section[open] > summary::after {
    transform: translateY(2px) rotate(225deg);
}
.admin-section summary:hover::after,
.admin-section summary:focus-visible::after { opacity: 1; }

.admin-item-title i {
    width: 28px;
    height: 28px;
    border: 0 !important;
    border-radius: 0;
    background: transparent !important;
    box-shadow: none !important;
}
.admin-item-title i::before {
    width: 12px;
    height: 12px;
    border-right-color: #e8edf5;
    border-bottom-color: #e8edf5;
    opacity: .95;
}
.admin-item-title:hover i { background: transparent !important; border-color: transparent !important; }
@media(max-width:650px){
    .admin-section summary { grid-template-columns: minmax(0, 1fr) auto auto; }
    .admin-item-title i { width: 36px; height: 36px; }
}


/* v1.10.14: rimuove marker nativi duplicati nei details admin */
.admin-section summary,
.admin-item-title {
    list-style: none !important;
}
.admin-section summary::marker,
.admin-item-title::marker {
    content: '' !important;
    display: none !important;
}
.admin-section summary::-webkit-details-marker,
.admin-item-title::-webkit-details-marker {
    display: none !important;
}

/* v1.10.15: refinement mirato per messaggi configurazione e strumenti statistiche */
.setup-warning{display:none;margin-top:12px;padding:12px 14px;border:1px solid rgba(245,158,11,.35);border-left:4px solid var(--amber);border-radius:12px;background:rgba(245,158,11,.1);color:var(--text);font-size:.86rem;font-weight:700}.setup-warning.visible{display:block}.stats-baggage-tools{display:grid;grid-template-columns:auto minmax(220px,1fr);gap:10px;align-items:center;margin:12px 0;padding:12px;border:1px solid var(--border);border-radius:12px;background:var(--card)}.stats-baggage-tools .option-field{margin:0}@media(max-width:650px){.stats-baggage-tools{grid-template-columns:1fr}.stats-baggage-tools button{width:100%}}

/* v1.10.16: bagagli più visibili nella striscia peso e azioni rapide */
.stats-baggage-actions{display:flex;justify-content:flex-end;margin:10px 0 6px}.stats-baggage-actions .btn-secondary{min-height:34px}.baggage-weight-strips{display:grid;gap:8px;margin:8px 0 10px}.baggage-weight-strip{display:grid;grid-template-columns:minmax(110px,220px) 1fr;gap:10px;align-items:center;color:var(--subtle);font-size:.72rem}.baggage-weight-strip>div:first-child{display:flex;justify-content:space-between;gap:8px}.baggage-weight-strip strong{color:var(--text)}.quick-baggage-move{display:grid;gap:8px;margin:12px 0;padding:12px;border:1px solid var(--border);border-radius:12px;background:var(--bg)}.quick-baggage-move>div{display:flex;flex-wrap:wrap;gap:8px}.quick-baggage-move select{min-width:150px;padding:8px;border:1px solid var(--border2);border-radius:9px;background:var(--surface2);color:var(--text)}.quick-baggage-move small{color:var(--subtle)}@media(max-width:650px){.stats-baggage-actions{justify-content:stretch}.stats-baggage-actions .btn-secondary{width:100%}.baggage-weight-strip{grid-template-columns:1fr}.quick-baggage-move>div{display:grid;grid-template-columns:1fr}.quick-baggage-move button{width:100%}}

/* v1.10.17: FAB più ordinato e feedback sempre accessibile accanto all'admin */
.header-feedback{display:inline-grid;place-items:center;width:34px;height:34px;border:1px solid rgba(139,92,246,.45);border-radius:10px;background:rgba(139,92,246,.14);color:#fff;cursor:pointer;box-shadow:0 8px 18px rgba(139,92,246,.16)}.header-feedback:hover,.header-feedback:focus-visible{border-color:var(--violet-h);background:rgba(139,92,246,.22);outline:0}.fab-more summary{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:10px}.fab-more summary::after{content:'⌄';display:inline-grid;place-items:center;width:22px;height:22px;color:var(--muted);font-size:1rem;line-height:1;transition:transform .18s ease,color .18s ease}.fab-more[open] summary::after{transform:rotate(180deg);color:var(--violet-h)}.fab-more summary::-webkit-details-marker{display:none}.fab-more summary::marker{content:''}

/* v1.10.18: etichetta testuale per il feedback header */
.header-feedback{width:auto;min-width:34px;padding:0 10px;grid-auto-flow:column;gap:6px;font-size:.78rem;font-weight:800}.header-feedback span:last-child{line-height:1}@media(max-width:520px){.header-feedback{padding:0 8px}.header-feedback span:last-child{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}}

/* v1.10.21: feedback obbligatorio più chiaro e categorie lista richiudibili */
.feedback-rating legend small,.feedback-comment strong small{color:var(--amber);font-size:.62rem;font-weight:800}.select-chevron{position:relative}.select-chevron select{appearance:none;padding-right:36px}.select-chevron::after{content:'⌄';position:absolute;right:13px;top:50%;display:grid;place-items:center;width:22px;height:22px;color:var(--muted);font-size:1rem;pointer-events:none;transform:translateY(-2px);transition:transform .18s ease,color .18s ease}.select-chevron:focus-within::after{color:var(--violet-h);transform:translateY(-2px) rotate(180deg)}.cat-header.cat-toggle{width:100%;border:0;background:transparent;color:inherit;cursor:pointer}.cat-header i{display:inline-grid;place-items:center;width:24px;height:24px;color:var(--muted);font-style:normal;transition:transform .18s ease,color .18s ease}.cat-box.collapsed .cat-header i{transform:rotate(-90deg);color:var(--violet-h)}.cat-box.collapsed .cat-items{display:none}.cat-items{display:grid;gap:0}

/* v1.10.23: intestazioni categorie packlist allineate allo stile chevron admin */
.cat-header.cat-toggle {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto 28px;
    align-items: center;
    gap: 12px;
    min-height: 58px;
    margin-bottom: 10px;
    padding: 0 14px 10px;
    text-align: left;
}
.cat-header .cat-name { min-width: 0; }
.cat-header .cat-count {
    justify-self: end;
    min-width: 44px;
    text-align: center;
}
.cat-header i {
    position: relative;
    justify-self: center;
    width: 28px;
    height: 28px;
    color: #e8edf5;
    font-size: 0;
    border: 0;
    background: transparent;
    box-shadow: none;
}
.cat-header i::before {
    content: '';
    width: 12px;
    height: 12px;
    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    opacity: .95;
    transform: translateY(-2px) rotate(45deg);
}
.cat-box.collapsed .cat-header i {
    color: #e8edf5;
    transform: rotate(-90deg);
}
.cat-header.cat-toggle:hover i,
.cat-header.cat-toggle:focus-visible i { color: var(--violet-h); }

/* v1.10.24: chevron coerenti per feedback e chiusura bagagli */
.select-chevron::after {
    content: '';
    right: 16px;
    width: 11px;
    height: 11px;
    border-right: 2px solid #e8edf5;
    border-bottom: 2px solid #e8edf5;
    opacity: .9;
    transform: translateY(-4px) rotate(45deg);
}
.select-chevron:focus-within::after { transform: translateY(0) rotate(225deg); }
.baggage-header.baggage-toggle {
    width: 100%;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    border: 0;
    background: transparent;
    color: inherit;
    font: inherit;
    text-align: left;
    cursor: pointer;
    appearance: none;
}
.baggage-heading { display: grid; min-width: 0; gap: 4px; }
.baggage-title { color: var(--text); font-size: 1rem; font-weight: 900; }
.baggage-header-actions { display: grid; grid-template-columns: auto 28px; align-items: center; gap: 12px; }
.baggage-header i {
    position: relative;
    display: grid;
    place-items: center;
    width: 28px;
    height: 28px;
    color: #e8edf5;
    font-size: 0;
}
.baggage-header i::before {
    content: '';
    width: 12px;
    height: 12px;
    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    opacity: .95;
    transform: translateY(-2px) rotate(45deg);
}
.baggage-section.collapsed .baggage-header i { transform: rotate(-90deg); }
.baggage-section.collapsed .cat-box { display: none; }
.baggage-header.baggage-toggle:hover i,
.baggage-header.baggage-toggle:focus-visible i { color: var(--violet-h); }
@media (max-width: 520px) {
    .baggage-header-actions { grid-template-columns: auto 24px; gap: 8px; }
    .baggage-header i { width: 24px; height: 24px; }
}


/* Reset sessione spostato fuori dal FAB: vicino ai controlli bagagli, ma discreto. */
.reset-inline {
    border-color: rgba(244, 63, 94, .28) !important;
    color: var(--rose) !important;
    background: rgba(244, 63, 94, .08) !important;
}
.reset-inline:hover,
.reset-inline:focus-visible {
    border-color: rgba(244, 63, 94, .55) !important;
    background: rgba(244, 63, 94, .14) !important;
}