:root{color-scheme:light dark;--bg: #f4f6f8;--surface: #ffffff;--surface-2: #eef2f6;--border: #d3dce5;--text: #16242f;--text-dim: #5d7183;--accent: #0f6fb5;--accent-strong: #0b537f;--ok: #1c7a4b;--warning: #a05c00;--error: #b32323;--route: #e4572e;--wind: #4a90c2;--radius: 10px;--gap: 1rem}@media(prefers-color-scheme:dark){:root{--bg: #0d1720;--surface: #14222e;--surface-2: #1b2c3a;--border: #263b4d;--text: #e6eef4;--text-dim: #93a8b9;--accent: #4aa3e0;--accent-strong: #74bdf0;--ok: #4cc38a;--warning: #e0a33a;--error: #f0736a;--route: #ff8a5c;--wind: #6fb3dd}}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font:16px/1.55 system-ui,-apple-system,Segoe UI,Roboto,sans-serif;-webkit-text-size-adjust:100%}h1,h2,h3{margin:0 0 .5rem;line-height:1.25}h1{font-size:1.25rem}h2{font-size:1.05rem;letter-spacing:.01em}p{margin:0 0 .75rem}.app-header{position:sticky;top:0;z-index:10;padding:.75rem 1rem 0;background:var(--surface);border-bottom:1px solid var(--border);padding-top:max(.75rem,env(safe-area-inset-top))}.tabs{display:flex;gap:.25rem;overflow-x:auto;scrollbar-width:none}.tabs::-webkit-scrollbar{display:none}.tab{flex:0 0 auto;padding:.5rem .85rem;border:none;border-bottom:2px solid transparent;background:none;color:var(--text-dim);font:inherit;font-size:.95rem;cursor:pointer}.tab-active{color:var(--accent);border-bottom-color:var(--accent);font-weight:600}.tab:disabled{opacity:.4;cursor:not-allowed}main{max-width:1100px;margin:0 auto;padding:1rem;padding-bottom:max(1rem,env(safe-area-inset-bottom))}.page{display:flex;flex-direction:column;gap:var(--gap)}.card{padding:1rem;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius)}.row{display:flex;flex-wrap:wrap;gap:.5rem;align-items:flex-end;margin-bottom:.5rem}.grid-2{display:grid;gap:var(--gap);grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}.hint{display:block;color:var(--text-dim);font-size:.85rem;margin:.25rem 0 0}.dim{color:var(--text-dim)}.empty{padding:2rem 1rem;color:var(--text-dim);text-align:center}.alert{margin:.75rem 0 0;padding:.6rem .8rem;border-radius:var(--radius);border-left:3px solid;font-size:.9rem}.alert ul,.alert li{margin:0}ul.alert{padding-left:1.6rem}.alert-ok{background:color-mix(in srgb,var(--ok) 12%,transparent);border-color:var(--ok)}.alert-info{background:color-mix(in srgb,var(--accent) 12%,transparent);border-color:var(--accent)}.alert-warning{background:color-mix(in srgb,var(--warning) 14%,transparent);border-color:var(--warning)}.alert-error{background:color-mix(in srgb,var(--error) 14%,transparent);border-color:var(--error)}.badge{display:inline-block;margin-left:.4rem;padding:.05rem .4rem;border-radius:999px;background:color-mix(in srgb,var(--warning) 25%,transparent);font-size:.75rem;white-space:nowrap}button{padding:.5rem .9rem;border:1px solid var(--border);border-radius:var(--radius);background:var(--surface-2);color:var(--text);font:inherit;cursor:pointer}button:hover:not(:disabled){border-color:var(--accent)}button:disabled{opacity:.45;cursor:not-allowed}button.primary{background:var(--accent);border-color:var(--accent);color:#fff;font-weight:600}button.danger{background:var(--error);border-color:var(--error);color:#fff;font-weight:600}button.link{padding:0;border:none;background:none;color:var(--accent);text-decoration:underline;font-size:.9rem}.field{display:block;margin-bottom:.85rem}.field>span:first-child,.field>legend{display:block;margin-bottom:.3rem;font-size:.9rem;font-weight:500}fieldset.field{border:none;padding:0;margin-inline:0}input[type=text],input[type=search],input[type=number],input[type=datetime-local],select,textarea{width:100%;padding:.45rem .6rem;border:1px solid var(--border);border-radius:var(--radius);background:var(--surface-2);color:var(--text);font:inherit}input[type=range]{width:100%;accent-color:var(--accent)}.checkbox,.radio{display:flex;gap:.5rem;align-items:flex-start;margin-bottom:.6rem;cursor:pointer}.checkbox input,.radio input{margin-top:.25rem;accent-color:var(--accent)}.inline-field{display:inline-flex;gap:.35rem;align-items:center;font-size:.9rem}.inline-field input{width:5.5rem}.collapsible summary,details.alert summary{cursor:pointer;font-size:.9rem}.polar-input{margin:.5rem 0;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.8rem;white-space:pre}.file-drop{display:flex;flex-direction:column;gap:.15rem;padding:1rem;border:2px dashed var(--border);border-radius:var(--radius);background:var(--surface-2);cursor:pointer;text-align:center}.file-drop-active,.file-drop:hover{border-color:var(--accent)}.file-drop-filled{border-style:solid;border-color:color-mix(in srgb,var(--ok) 50%,var(--border))}.file-name{font-size:.9rem;word-break:break-all}.file-summary{color:var(--ok);font-size:.85rem}.stats{display:grid;gap:.5rem;grid-template-columns:repeat(auto-fit,minmax(110px,1fr));margin-bottom:.75rem}.stat{display:flex;flex-direction:column;padding:.6rem .7rem;background:var(--surface-2);border-radius:var(--radius)}.stat-value{font-size:1.2rem;font-weight:600;font-variant-numeric:tabular-nums}.stat-label{color:var(--text-dim);font-size:.8rem}.stat-sub{color:var(--text-dim);font-size:.75rem}.checklist{margin:0 0 1rem;padding:0;list-style:none}.checklist li{display:flex;gap:.5rem;font-size:.9rem}.check-done span:first-child{color:var(--ok)}.check-todo{color:var(--text-dim)}.table-scroll{overflow-x:auto}.table{width:100%;border-collapse:collapse;font-size:.88rem}.table th,.table td{padding:.4rem .55rem;border-bottom:1px solid var(--border);text-align:left;white-space:nowrap}.table th{color:var(--text-dim);font-weight:500;font-size:.8rem}.table .right{text-align:right;font-variant-numeric:tabular-nums}.row-best{background:color-mix(in srgb,var(--ok) 10%,transparent)}.score-table{max-width:34rem;margin-bottom:.75rem}.score-table td:first-child{white-space:normal}.score-table .row-total td{border-top:2px solid var(--border);border-bottom:none;font-size:1rem}.row-sluis{background:color-mix(in srgb,var(--warning) 8%,transparent)}.chips{display:flex;flex-wrap:wrap;gap:.35rem;margin-bottom:.5rem}.chip{padding:.3rem .65rem;border-radius:999px;font-size:.85rem;opacity:.55}.chip-on{background:var(--accent);border-color:var(--accent);color:#fff;opacity:1}.sluis-list{margin:0 0 .75rem;padding:0;list-style:none}.sluis-list li{display:flex;flex-wrap:wrap;gap:.75rem;align-items:center;padding:.5rem 0;border-bottom:1px solid var(--border)}.sluis-list .checkbox{margin:0;flex:1 1 12rem}.picker{margin-top:.5rem}.picker-list{max-height:240px;margin:.5rem 0;padding:0;overflow-y:auto;list-style:none;border:1px solid var(--border);border-radius:var(--radius)}.picker-list button{width:100%;border:none;border-radius:0;background:none;text-align:left}.chart{display:block;width:100%;background:color-mix(in srgb,var(--accent) 7%,var(--surface));border-radius:var(--radius)}.chart-legs line{stroke:var(--border);stroke-width:1.5}.chart-route line{stroke:var(--route);stroke-width:4;stroke-linecap:round;opacity:.85}.route-arrow{fill:var(--route)}.chart-wind line{stroke:var(--wind);stroke-width:2;opacity:.75}.chart-wind circle{fill:var(--wind);opacity:.75}.buoy circle{fill:var(--surface);stroke:var(--text-dim);stroke-width:2}.buoy text{fill:var(--text);font-size:15px;paint-order:stroke;stroke:var(--surface);stroke-width:4px}.buoy-start circle{fill:var(--ok);stroke:var(--surface)}.buoy-finish circle{fill:var(--route);stroke:var(--surface)}.buoy-highlight circle{stroke:var(--accent);stroke-width:3}.chart-scale line{stroke:var(--text-dim);stroke-width:2}.chart-scale text{fill:var(--text-dim);font-size:14px;text-anchor:middle}.polar-plot{display:block;width:100%}.polar-ring path{stroke:var(--border);stroke-width:1}.polar-ring text,.polar-spoke text{fill:var(--text-dim);font-size:10px}.polar-spoke line{stroke:var(--border);stroke-width:1}.polar-spoke text{text-anchor:start}.polar-label-vertical{text-anchor:middle}.polar-excluded{fill:color-mix(in srgb,var(--error) 14%,transparent)}.polar-curve path{stroke:var(--accent);stroke-width:2}.polar-curve text{fill:var(--accent);font-size:10px;text-anchor:middle}.polar-vmg line{stroke:var(--route);stroke-width:1.5;stroke-dasharray:4 3}@media print{.app-header,.row,.hint{display:none}.card{border:none;padding:0;break-inside:avoid}.table th,.table td{padding:.2rem .4rem;font-size:.75rem}}
