.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}:root{--color-bg: #0a0a0a;--color-surface: #111111;--color-border: #333333;--color-text: #f0f0f0;--color-muted: #666666;--color-accent: #f0f0f0;--font-display: "Arial Narrow", Arial, sans-serif;--font-body: Arial, sans-serif;--radius: 2px;--transition: 80ms ease}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{-webkit-text-size-adjust:100%}body{font-family:var(--font-body);background:var(--color-bg);color:var(--color-text);line-height:1.4;min-height:100dvh}.layout{padding:0 16px 40px;max-width:480px;margin:0 auto}@media(min-width:640px){.layout{max-width:560px;padding:0 24px 40px}}.header{display:flex;align-items:center;justify-content:space-between;padding:16px;border-bottom:2px solid var(--color-border);margin-bottom:24px;max-width:560px;margin-left:auto;margin-right:auto}.header__title{font-family:var(--font-display);font-size:1.1rem;font-weight:800;text-transform:uppercase;letter-spacing:.08em;color:var(--color-text);text-decoration:none}.header__nav{display:flex;align-items:center;gap:12px}.header__link{color:var(--color-text);display:flex;align-items:center;text-decoration:none;opacity:.7;transition:opacity var(--transition)}.header__link:hover{opacity:1}.unit-toggle{display:flex;border:2px solid var(--color-border);border-radius:var(--radius);overflow:hidden}.unit-toggle__btn{font-family:var(--font-display);font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em;padding:4px 10px;border:none;background:transparent;color:var(--color-muted);cursor:pointer;transition:background var(--transition),color var(--transition)}.unit-toggle__btn.active{background:var(--color-text);color:var(--color-bg)}.mode-tabs{display:flex;margin-bottom:24px;border-bottom:2px solid var(--color-border)}.mode-tab{flex:1;font-family:var(--font-display);font-size:.85rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em;padding:10px 16px;border:none;background:transparent;color:var(--color-muted);cursor:pointer;border-bottom:2px solid transparent;margin-bottom:-2px;transition:color var(--transition),border-color var(--transition)}.mode-tab.active{color:var(--color-text);border-bottom-color:var(--color-text)}.mode-tab:disabled{cursor:not-allowed;opacity:.3}.section-label{display:block;font-family:var(--font-display);font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:var(--color-muted);margin-bottom:8px}.weight-input-group{position:relative;margin-bottom:20px}.weight-input{width:100%;font-family:var(--font-display);font-size:3rem;font-weight:800;background:var(--color-surface);color:var(--color-text);border:2px solid var(--color-border);border-radius:var(--radius);padding:12px 60px 12px 16px;outline:none;-moz-appearance:textfield}.weight-input::-webkit-outer-spin-button,.weight-input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.weight-input:focus{border-color:var(--color-text)}.weight-input-unit{position:absolute;right:16px;top:50%;transform:translateY(-50%);font-family:var(--font-display);font-size:1rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--color-muted);pointer-events:none}.bar-section{margin-bottom:24px}.bar-presets{display:flex;gap:8px;margin-bottom:8px}.preset-btn{font-family:var(--font-display);font-size:.85rem;font-weight:700;padding:8px 16px;border:2px solid var(--color-border);border-radius:var(--radius);background:transparent;color:var(--color-muted);cursor:pointer;transition:background var(--transition),color var(--transition),border-color var(--transition)}.preset-btn.active{background:var(--color-text);color:var(--color-bg);border-color:var(--color-text)}.preset-btn:hover:not(.active){border-color:var(--color-text);color:var(--color-text)}.bar-custom-row{display:flex;align-items:center;gap:8px}.bar-custom-input{width:80px;font-family:var(--font-display);font-size:1rem;font-weight:700;background:var(--color-surface);color:var(--color-text);border:2px solid var(--color-border);border-radius:var(--radius);padding:8px 12px;outline:none;-moz-appearance:textfield}.bar-custom-input::-webkit-outer-spin-button,.bar-custom-input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.bar-custom-input:focus{border-color:var(--color-text)}.bar-custom-label{font-family:var(--font-display);font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--color-muted)}.ratio-presets{display:flex;gap:8px}.result-svg-container--portrait svg{width:auto;max-width:200px;margin:0 auto}.result{margin-top:32px}.result[hidden]{display:none}.result-message{font-family:var(--font-display);font-size:.8rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--color-muted);margin-bottom:16px;padding:8px 12px;border-left:3px solid var(--color-muted)}.result-message--warning{color:#e8a735;border-left-color:#e8a735}.result-svg-container{margin-bottom:20px;overflow-x:auto}.result-svg-container svg{display:block;width:100%;height:auto;min-height:60px}.plate-breakdown{display:flex;flex-direction:column;gap:4px}.plate-row{display:flex;justify-content:space-between;align-items:center;padding:6px 0;border-bottom:1px solid var(--color-border);font-family:var(--font-display);font-size:.9rem;font-weight:700;text-transform:uppercase}.plate-row__weight{color:var(--color-text)}.plate-row__count{color:var(--color-muted)}.placeholder{text-align:center;padding:60px 16px;color:var(--color-muted);font-family:var(--font-display);font-size:.9rem;font-weight:700;text-transform:uppercase;letter-spacing:.1em}.plate-list{display:flex;flex-direction:column}.plate-row-config{display:flex;justify-content:space-between;align-items:center;padding:12px 0;border-bottom:1px solid var(--color-border)}.plate-row-config__label{font-family:var(--font-display);font-size:1.3rem;font-weight:800;color:var(--color-text)}.plate-row-config__unit{font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--color-muted);margin-left:4px}.plate-row-config__controls{display:flex;align-items:center;gap:8px}.plate-mode-toggle{display:flex;border:2px solid var(--color-border);border-radius:var(--radius);overflow:hidden}.plate-mode-toggle__btn{font-family:var(--font-display);font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em;padding:6px 10px;border:none;background:transparent;color:var(--color-muted);cursor:pointer;transition:background var(--transition),color var(--transition)}.plate-mode-toggle__btn.active{background:var(--color-text);color:var(--color-bg)}.plate-quantity-input{width:56px;font-family:var(--font-display);font-size:.9rem;font-weight:700;text-align:center;background:var(--color-surface);color:var(--color-text);border:2px solid var(--color-border);border-radius:var(--radius);padding:5px 4px;outline:none;-moz-appearance:textfield}.plate-quantity-input::-webkit-outer-spin-button,.plate-quantity-input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.plate-quantity-input:focus{border-color:var(--color-text)}.plate-quantity-input.hidden{display:none}.reset-btn{width:100%;margin-top:24px;font-family:var(--font-display);font-size:.8rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em;padding:10px 16px;border:2px solid var(--color-border);border-radius:var(--radius);background:transparent;color:var(--color-muted);cursor:pointer;transition:border-color var(--transition),color var(--transition)}.reset-btn:hover{border-color:var(--color-text);color:var(--color-text)}