:root{font-family:"Yu Gothic UI","Hiragino Kaku Gothic ProN",Meiryo,system-ui,sans-serif;color:#16324d;background:#f2f8fb;font-synthesis:none;--ink:#16324d;--muted:#55708c;--line:#d7e7f0;--blue:#245ad8;--cyan:#087a9a;--green:#08795b;--red:#aa3d31;--surface:#fff;--shadow:0 12px 34px rgba(20,77,112,.07)}
*{box-sizing:border-box} [hidden]{display:none!important} body{margin:0;min-width:320px;min-height:100vh;background:linear-gradient(135deg,#f5faff 0%,#effaf9 100%);font-size:15px} button,input{font:inherit} button{cursor:pointer} button:disabled{opacity:.6;cursor:wait} :focus-visible{outline:3px solid var(--cyan);outline-offset:2px}
.skip-link{position:fixed;z-index:100;top:0;left:12px;padding:10px;background:var(--ink);color:#fff;transform:translateY(-120%)}.skip-link:focus{transform:none}
.header{position:sticky;top:0;z-index:10;background:rgba(242,248,251,.94);border-bottom:1px solid var(--line);backdrop-filter:blur(12px)}.header-inner{max-width:560px;min-height:68px;margin:auto;padding:10px 18px;display:flex;align-items:center;justify-content:space-between;gap:12px}.brand{display:flex;align-items:center;gap:9px}.brand img{flex:none}.brand-copy{display:grid;gap:1px}.brand-copy span{color:var(--muted);font-size:11px;font-weight:800;letter-spacing:.08em}.brand h1{margin:0;font-size:21px;line-height:1.2;letter-spacing:-.03em}.header time{color:var(--muted);font-size:12px;white-space:nowrap}
.main{width:min(100%,560px);margin:auto;padding:18px 16px calc(38px + env(safe-area-inset-bottom))}.name-panel,.vehicle-card,.empty{background:var(--surface);border:1px solid var(--line);border-radius:16px;box-shadow:var(--shadow)}.name-panel{padding:17px;margin-bottom:24px}.name-panel label{display:block;margin-bottom:9px;font-size:14px;font-weight:800}.name-panel input,#action-input,#action-key-location{display:block;width:100%;min-height:48px;padding:10px 13px;border:1px solid #b9cfdd;border-radius:10px;background:#fff;color:var(--ink);font-size:16px}.name-panel p{margin:8px 0 0;color:var(--muted);font-size:12px}
h2{margin:0;font-size:18px;letter-spacing:-.02em}#mine-section{margin-bottom:26px}#mine-section h2{margin:0 0 12px}.section-head{display:flex;align-items:baseline;justify-content:space-between;gap:10px;margin-bottom:13px}.section-head span{color:var(--muted);font-size:12px}.segments{display:grid;grid-template-columns:1fr 1fr;gap:4px;padding:4px;margin-bottom:16px;border:1px solid var(--line);border-radius:12px;background:#eaf2f7}.segments button{min-height:44px;border:0;border-radius:9px;background:transparent;color:var(--muted);font-size:14px;font-weight:800}.segments button[aria-pressed=true]{background:#fff;color:var(--blue);box-shadow:0 2px 8px rgba(20,77,112,.1)}.card-list{display:grid;gap:12px}.vehicle-card{min-width:0;padding:17px}.vehicle-card.mine{border:2px solid var(--blue);background:linear-gradient(135deg,#fff,#f3f8ff)}.card-top{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}.vehicle-name{margin:0;min-width:0;overflow-wrap:anywhere;font-size:21px;line-height:1.35}.plate{margin:4px 0 0;color:var(--muted);font-size:13px;overflow-wrap:anywhere}.status{flex:none;padding:5px 9px;border-radius:99px;background:#e7f6ee;color:var(--green);font-size:12px;font-weight:800}.status.out{background:#e9f0ff;color:var(--blue)}.card-meta{display:grid;gap:6px;margin:16px 0;color:var(--muted);font-size:13px;overflow-wrap:anywhere}.card-meta strong{color:var(--ink);font-weight:700}.primary-button,.secondary-button{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:10px 14px;border-radius:10px;font-weight:800}.primary-button{width:100%;border:1px solid var(--blue);background:linear-gradient(120deg,var(--blue),var(--cyan));color:#fff}.mine .primary-button{min-height:54px}.secondary-button{border:1px solid #b9cfdd;background:#fff;color:var(--blue)}.empty{text-align:center;padding:24px 16px}.empty p{margin:0 0 14px;font-weight:700}.toast{position:fixed;z-index:40;left:50%;bottom:calc(16px + env(safe-area-inset-bottom));width:min(calc(100% - 32px),528px);padding:13px 16px;transform:translateX(-50%);border-radius:12px;background:#e9f7ee;border:1px solid #9cd1b7;color:var(--green);box-shadow:0 10px 30px rgba(20,77,112,.18)}.toast.error{background:#fff0ed;border-color:#e9b6ad;color:var(--red)}
dialog{width:min(calc(100% - 32px),480px);max-height:calc(100dvh - 32px);padding:0;border:0;border-radius:18px;background:#fff;color:var(--ink);box-shadow:0 25px 70px rgba(12,44,70,.25)}dialog::backdrop{background:rgba(13,37,61,.45)}dialog form{padding:22px}.sheet-handle{display:none}.dialog-head{display:flex;align-items:center;justify-content:space-between;gap:12px}.close-button{width:44px;height:44px;border:0;border-radius:50%;background:#edf4f8;color:var(--ink);font-size:25px}#action-description{margin:6px 0 20px;color:var(--muted);overflow-wrap:anywhere}#action-label,.field-label{display:block;margin-bottom:8px;font-weight:800}.field-label{margin-top:16px}.form-error{margin:10px 0 0;color:var(--red);font-size:13px}.dialog-actions{display:grid;grid-template-columns:1fr 1.5fr;gap:10px;margin-top:24px}.dialog-actions .primary-button{width:100%}
@media(max-width:600px){dialog{position:fixed;top:auto;bottom:0;left:0;right:0;width:100%;max-width:none;max-height:calc(100dvh - 20px);margin:0;border-radius:20px 20px 0 0}dialog form{padding:10px 18px calc(18px + env(safe-area-inset-bottom));overflow-y:auto;max-height:calc(100dvh - 20px)}.sheet-handle{display:block;width:42px;height:5px;margin:0 auto 14px;border-radius:9px;background:#c1d4e0}}
