/* Travel uses the approved graphite tokens, Arabic type and shared 3:4 board. */
.travel-shell{box-sizing:border-box;padding:0;border:1px solid var(--line);border-radius:26px;width:min(100%,480px);height:min(920px,100dvh);max-width:100vw;max-height:100dvh;margin:auto;background:var(--paper);color:var(--ink);overflow:hidden;font:inherit;box-shadow:var(--shadow)}
.travel-shell[open]{display:flex;flex-direction:column}.travel-shell::backdrop,.travel-swap::backdrop{background:#0007;backdrop-filter:blur(4px)}
.travel-shell *{box-sizing:border-box}.travel-header{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding:20px 20px 14px;border-bottom:1px solid var(--line);flex:none}.travel-header>div{min-width:0}.travel-header small{font-size:11px;color:var(--muted);font-weight:500}.travel-header h1{font-size:25px;line-height:1.4;margin:2px 0;font-weight:700;overflow-wrap:anywhere}.travel-header p{font-size:12px;color:var(--muted);margin:3px 0 0}
.travel-icon{display:grid;place-items:center;width:44px;height:44px;flex:0 0 44px;padding:0;border-radius:50%;border:1px solid var(--line);color:var(--ink);background:var(--white);font:26px/1 system-ui;cursor:pointer}.travel-scroll{min-height:0;overflow:auto;overscroll-behavior:contain;padding:16px 20px;flex:1}.travel-footer{flex:none;display:flex;gap:10px;padding:12px 20px calc(12px + env(safe-area-inset-bottom));background:var(--paper);border-top:1px solid var(--line)}
.travel-primary,.travel-secondary{display:inline-flex;justify-content:center;align-items:center;gap:8px;min-height:44px;border-radius:15px;padding:9px 14px;font:600 13px/1.5 inherit;font-family:inherit;font-size:13px;cursor:pointer;transition:background .18s,transform .18s;border:1px solid var(--line);color:var(--ink);background:var(--white)}.travel-primary{background:var(--accent);color:var(--on-accent);border-color:var(--accent);font-weight:600}.travel-footer .travel-primary{flex:1}.travel-shell button:active{transform:scale(.985)}.travel-shell button:disabled{opacity:.45;cursor:default}.travel-shell :is(button,input,textarea):focus-visible,.travel-swap button:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.travel-step{font-size:11px;letter-spacing:.01em;color:var(--muted);margin-bottom:18px}.travel-shell form{display:grid;gap:18px}.travel-shell form label{display:grid;gap:7px;font-size:12px;font-weight:500;min-width:0}.travel-shell input:not([type=checkbox],[type=radio]),.travel-shell textarea{width:100%;min-width:0;min-height:48px;border:1px solid var(--line);border-radius:13px;padding:10px 12px;font:inherit;font-size:14px;color:var(--ink);background:var(--white);box-shadow:none}.travel-fields{display:grid;grid-template-columns:1fr 1.5fr;gap:12px}.travel-shell textarea{resize:vertical;max-height:150px}.travel-shell fieldset{border:0;padding:0;margin:0;min-width:0}.travel-shell legend{font-size:12px;margin-bottom:8px}.travel-options{display:flex;gap:8px}.travel-options label{flex:1;cursor:pointer;position:relative}.travel-options input{position:absolute;opacity:0;width:1px}.travel-options span{padding:10px 3px;min-height:44px;border:1px solid var(--line);border-radius:13px;background:var(--white);text-align:center;font-size:12px}.travel-options input:checked+span{background:var(--accent-soft);border-color:var(--accent);font-weight:600}.travel-options input:focus-visible+span{outline:2px solid var(--accent);outline-offset:3px}
.travel-hint{font-size:11px;line-height:1.7;color:var(--muted);margin:16px 0 0}.travel-empty{text-align:center;padding:40px 12px}.travel-empty h2{font-size:23px;margin:22px 0 8px}.travel-empty p{font-size:14px;line-height:1.9;color:var(--muted);max-width:270px;margin:auto}.travel-hero-icon{margin:auto;width:110px;height:140px;border-radius:60px 60px 20px 20px;border:1px solid var(--line);background:var(--accent-soft);display:grid;place-items:center}.travel-hero-icon svg{width:48px;height:48px;color:var(--accent)}
.travel-trip{width:100%;display:grid;grid-template-columns:70px 1fr 15px;text-align:start;align-items:center;gap:14px;background:var(--white);color:var(--ink);border:1px solid var(--line);border-radius:20px;padding:14px;margin-bottom:12px;font:inherit;cursor:pointer}.travel-trip>span:nth-child(2){display:grid;gap:3px}.travel-trip strong{font-size:17px;overflow-wrap:anywhere}.travel-trip small,.travel-trip span span{font-size:11px;color:var(--muted)}.travel-trip-art{height:90px;background:var(--accent-soft);border-radius:40px 40px 12px 12px;overflow:hidden;display:grid;place-items:center}.travel-trip-art img{width:100%;height:100%;object-fit:contain}.travel-missing-art svg{width:28px;height:28px}
.travel-tabs{display:flex;gap:8px;margin-bottom:18px}.travel-tabs button{flex:1;font-size:12px}.travel-summary{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:8px 0 18px}.travel-summary strong{font-size:17px}.travel-summary span{font-size:11px;color:var(--muted)}.travel-day-list{display:grid;gap:10px}.travel-day-row{display:flex;gap:12px;align-items:center;background:var(--white);border:1px solid var(--line);border-radius:18px;padding:13px;text-align:start;width:100%;color:var(--ink);font:inherit;cursor:pointer}.travel-day-number{align-self:flex-start;min-width:30px;height:30px;display:grid;place-items:center;border-radius:50%;font-size:13px;background:var(--accent-soft);color:var(--accent)}.travel-day-copy{display:grid;gap:4px;flex:1;min-width:0}.travel-day-copy strong{font-size:14px}.travel-day-copy small{font-size:11px;color:var(--muted);line-height:1.5;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.travel-mini-pieces{display:flex;gap:5px;margin-top:6px}.travel-mini-pieces img{width:36px;height:42px;object-fit:contain;background:var(--accent-soft);border-radius:7px}.travel-day-nav{display:flex;align-items:center;justify-content:space-between;direction:ltr;margin-bottom:8px}.travel-day-nav span{font-size:12px;color:var(--muted)}.travel-board{background:var(--white);border:1px solid var(--line);border-radius:22px;padding:8px;min-width:0}.travel-board .lb-board{aspect-ratio:3/4}.travel-board .lb-inspect{cursor:pointer}.travel-reason{font-size:13px;line-height:1.8;margin:12px 0}.travel-inline-actions{display:flex;gap:8px}.travel-inline-actions button{flex:1;font-size:11px}.travel-alert{font-size:12px;line-height:1.8;padding:12px;border:1px solid var(--line);border-inline-start:3px solid var(--warn-text);border-radius:12px;color:var(--ink);background:var(--accent-soft);margin:0 0 12px}.travel-alert p{margin:4px 0}.travel-alert button{margin-inline-start:8px}
.travel-progress{background:var(--white);border:1px solid var(--line);border-radius:22px;padding:20px;margin-bottom:14px}.travel-progress>div{display:flex;justify-content:space-between;align-items:center;gap:8px}.travel-progress strong{font:600 32px/1.2 system-ui}.travel-progress strong small{font-size:18px;color:var(--muted)}.travel-progress span{font-size:12px}.travel-progress progress{width:100%;height:5px;border:0;border-radius:8px;margin:18px 0 8px;overflow:hidden;accent-color:var(--accent)}.travel-progress progress::-webkit-progress-bar{background:var(--accent-soft)}.travel-progress progress::-webkit-progress-value{background:var(--accent);transition:width .2s}.travel-progress p{font-size:11px;color:var(--muted);margin:6px 0 0}.travel-pack-row{display:flex;align-items:center;gap:12px;padding:12px 0;border-bottom:1px solid var(--line);cursor:pointer;min-height:80px}.travel-pack-row input{width:22px;height:22px;accent-color:var(--accent);flex:none;margin:0}.travel-pack-image{width:50px;height:58px;display:grid;place-items:center;background:var(--white);border-radius:30px 30px 8px 8px;overflow:hidden;flex:none}.travel-pack-image img{width:100%;height:100%;object-fit:contain}.travel-pack-row>span:last-child{display:grid;gap:5px}.travel-pack-row strong{font-size:13px;font-weight:500}.travel-pack-row small{font-size:11px;color:var(--muted)}.travel-pack-row:has(input:checked) strong{color:var(--muted)}.travel-pack-row.is-missing{border-inline-start:2px solid var(--warn-text);padding-inline-start:8px}.travel-swap{width:min(94vw,440px);max-height:85dvh;overflow:auto;border:1px solid var(--line);border-radius:24px;padding:18px;background:var(--paper);color:var(--ink);margin:auto}.travel-swap header{display:flex;justify-content:space-between;align-items:center;gap:10px}.travel-swap h2{font-size:18px;margin:0}.travel-swap p{font-size:12px;color:var(--muted)}.travel-swap-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.travel-swap-grid button{display:grid;gap:10px;border:1px solid var(--line);background:var(--white);border-radius:80px 80px 16px 16px;padding:12px;color:var(--ink);font:inherit}.travel-swap-grid img{width:100%;height:150px;object-fit:contain}.travel-swap-grid strong{font-size:12px}.travel-busy{display:flex;gap:10px;align-items:center;font-size:12px}.travel-busy>span{width:16px;height:16px;border:2px solid var(--line);border-top-color:var(--accent);border-radius:50%;animation:trip-spin 1s linear infinite}@keyframes trip-spin{to{transform:rotate(360deg)}}
@media(max-width:500px){.travel-shell{width:100%;height:100dvh;border-radius:0;border:0}.travel-header{padding:16px 18px 12px}.travel-scroll{padding:14px 18px}.travel-footer{padding-inline:18px}}
@media(max-width:350px){.travel-header h1{font-size:23px}.travel-scroll{padding:12px 14px}.travel-footer{padding-inline:14px;gap:6px}.travel-fields{grid-template-columns:1fr 1.3fr;gap:8px}.travel-primary,.travel-secondary{font-size:12px;padding-inline:10px}.travel-mini-pieces img{width:29px;height:36px}.travel-day-row{padding:10px;gap:8px}}
@media(prefers-reduced-motion:reduce){.travel-shell *{animation:none!important;transition:none!important}}

/* My looks and My trips share one navigation destination. */
.saved-collection-tabs{display:flex;gap:4px;padding:4px;margin:0 0 16px;border:1px solid var(--line);border-radius:16px;background:var(--white)}
.saved-collection-tabs [role=tab]{flex:1;min-width:0;min-height:44px;border:0;border-radius:12px;background:transparent;color:var(--muted);font-family:inherit;font-size:14px;font-weight:600;line-height:1.5;cursor:pointer;transition:background .18s,color .18s}
.saved-collection-tabs [role=tab][aria-selected=true]{background:var(--accent);color:var(--on-accent,#fff)}
.saved-collection-tabs [role=tab]:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
#saved-looks-panel[hidden],#saved-trips-panel[hidden]{display:none!important}
.saved-trips-list{display:grid;gap:10px}.saved-trips-list .travel-trip{margin:0}
.saved-trips-list .travel-trip>span:nth-child(2){min-width:0;overflow-wrap:anywhere}
#saved-trips-panel .travel-empty{padding:26px 12px}
@media(prefers-reduced-motion:reduce){.saved-collection-tabs [role=tab]{transition:none}}

/* A localized date field and calendar, independent of the browser date widget. */
.travel-date-field{display:grid;gap:7px;min-width:0;font-size:12px;font-weight:500;align-content:start}
.travel-date-trigger{display:flex;align-items:center;justify-content:space-between;gap:6px;width:100%;min-height:48px;padding:10px 11px;border:1px solid var(--line);border-radius:13px;background:var(--white);color:var(--ink);font:inherit;font-size:12px;text-align:start;cursor:pointer}
.travel-date-trigger.is-empty{color:var(--muted)}.travel-date-trigger svg{width:19px;height:19px;flex:none}.travel-date-trigger [data-date-value]{min-width:0;line-height:1.6}
.travel-options span{display:flex;align-items:center;justify-content:center;min-height:48px;line-height:1.4}
.travel-calendar{box-sizing:border-box;width:min(360px,calc(100vw - 24px));max-width:calc(100vw - 24px);max-height:calc(100dvh - 32px);margin:auto;padding:16px;border:1px solid var(--line);border-radius:24px;background:var(--paper);color:var(--ink);font:inherit;box-shadow:var(--shadow);overflow:auto}
.travel-calendar::backdrop{background:#0007;backdrop-filter:blur(4px)}
.travel-calendar header{display:flex;align-items:center;justify-content:space-between;gap:8px}.travel-calendar h2{font-size:17px;line-height:1.5;margin:0}.travel-calendar-month{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:14px 0 8px}.travel-calendar-month strong{font-size:15px;font-weight:600}
.travel-calendar-grid [role=row]{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:2px}.travel-calendar-grid [role=gridcell]{min-width:0;display:grid;place-items:center;height:42px}.travel-calendar-weekdays span{min-width:0;text-align:center;font-size:10px;line-height:24px;color:var(--muted);padding-bottom:5px}
.travel-calendar-grid button{width:100%;height:38px;min-width:0;border:1px solid transparent;border-radius:11px;background:transparent;color:var(--ink);font:inherit;font-size:14px;cursor:pointer;transition:background .15s}
.travel-calendar-grid button[aria-current=date]{border-color:var(--accent-line)}.travel-calendar-grid [aria-selected=true] button{background:var(--accent);color:var(--on-accent)}
.travel-calendar footer{display:flex;gap:8px;border-top:1px solid var(--line);padding-top:12px;margin-top:10px}.travel-calendar footer button{flex:1}.travel-calendar button:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
@media(max-width:350px){.travel-calendar{padding:12px}.travel-date-trigger{padding-inline:8px;font-size:11px}.travel-calendar-weekdays span{font-size:9px}}
.travel-destination-preview{display:flex;align-items:center;gap:14px;background:var(--white);border:1px solid var(--line);border-radius:20px;padding:10px 14px}.travel-destination-preview .destination-sticker{width:62px;flex:none}.travel-destination-preview>span{display:grid;gap:6px}.travel-destination-preview strong{font-size:17px}.travel-destination-preview small{font-size:11px;color:var(--muted)}
.travel-trip-art .destination-sticker{width:100%;height:100%;object-fit:contain}.travel-trip-art:has(.destination-sticker){background:none;border-radius:0;overflow:visible}
.travel-shell select{font:inherit;font-size:14px;width:100%;min-width:0;min-height:48px;padding:10px 12px;color:var(--ink);background:var(--white);border:1px solid var(--line);border-radius:13px}
.travel-city-field{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:8px}.travel-city-field button{min-height:48px}.travel-city-selected{font-size:11px;color:var(--muted);margin:-8px 0 0}.travel-city-selected:empty,[data-city-results]:empty{display:none}.travel-city-result{display:flex;align-items:center;justify-content:space-between;gap:8px;text-align:start;width:100%;font:inherit;font-size:13px;color:var(--ink);background:var(--white);border:1px solid var(--line);padding:12px;border-radius:12px;margin-bottom:6px;cursor:pointer}.travel-city-result small{font-size:11px;color:var(--muted)}
.travel-weather{background:var(--accent-soft);border:1px solid var(--line);border-radius:16px;padding:12px;font-size:11px;line-height:1.7}.travel-weather-heading{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:6px}.travel-weather-heading strong{font-size:13px}.travel-weather-heading button{font:inherit;border:0;border-bottom:1px solid currentColor;color:var(--accent-text);background:none;cursor:pointer;padding:6px;min-height:32px}.travel-weather-day{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:3px 8px;padding-block:6px;border-top:1px solid var(--line)}.travel-weather-day strong{font-size:14px;white-space:nowrap}.travel-weather-day small{grid-column:1/-1;color:var(--muted)}.travel-weather>small{display:block;color:var(--muted);font-size:9px;margin-top:5px}
.travel-explanation{padding:16px;margin-top:16px;background:var(--white);border:1px solid var(--line);border-radius:20px}.travel-explanation>small{font-size:10px;color:var(--muted)}.travel-explanation h2{font-size:17px;margin:4px 0 10px}.travel-explanation p{font-size:12px;line-height:1.9;margin:6px 0;color:var(--muted)}.travel-explanation button{margin-top:8px;width:100%}
.travel-chat-context{display:flex;align-items:center;gap:8px;padding:10px 12px;margin:8px 0;background:var(--accent-soft);border:1px solid var(--line);border-radius:14px;font-size:12px}.travel-chat-context span{flex:1}.travel-chat-context button{font:inherit;font-size:11px;color:var(--accent-text);border:1px solid var(--line);border-radius:10px;background:var(--white);padding:10px;cursor:pointer}
