*,*:before,*:after{margin:0;padding:0;box-sizing:border-box}:root{--bg: #1a1a2e;--surface: #16213e;--surface-hover: #1a2744;--border: #0f3460;--text: #e4e4e4;--text-muted: #a0a0b0;--accent: #e94560;--seat-active: #e94560;--seat-inactive: #2a2a4a;--radius: 8px}body{font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;background:var(--bg);color:var(--text);min-height:100vh}#root{min-height:100vh}.controls{display:flex;flex-wrap:wrap;gap:16px;padding:20px;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);width:100%;align-items:flex-end}.controls__label{display:flex;flex-direction:column;gap:4px;font-size:.85rem;color:var(--text-muted);min-width:100px}.controls__input{background:var(--bg);border:1px solid var(--border);border-radius:6px;color:var(--text);padding:8px 10px;font-size:.95rem;outline:none;transition:border-color .2s}.controls__input:focus{border-color:var(--accent)}.controls__color{width:100%;height:36px;border:1px solid var(--border);border-radius:6px;background:var(--bg);cursor:pointer;padding:2px}.controls__stats{margin-left:auto;font-size:.85rem;color:var(--text-muted);display:flex;align-items:center}.controls__actions{display:flex;flex-direction:row;gap:8px}.controls__btn{padding:10px;border:none;border-radius:6px;font-size:.9rem;font-weight:600;cursor:pointer;transition:opacity .2s,transform .1s}.controls__btn:hover{opacity:.9}.controls__btn:active{transform:scale(.97)}.controls__btn--fill{background:var(--accent);color:#fff}.controls__btn--clear{background:var(--border);color:var(--text)}.controls__btn--export{background:#0f3460;color:#fff}.controls__btn--reset{background:#c0392b;color:#fff}.seat-cell{display:flex;flex-direction:column;align-items:center;gap:2px;cursor:pointer;user-select:none;-webkit-user-select:none}.seat-cell__circle{width:27px;height:27px;border-radius:50%;background:var(--seat-inactive);transition:background-color .15s,transform .15s,box-shadow .15s}.seat-cell:hover .seat-cell__circle{transform:scale(1.15);box-shadow:0 0 8px #ffffff26}.seat-cell__circle--active{background:var(--seat-color, var(--seat-active));box-shadow:0 0 6px color-mix(in srgb,var(--seat-color, var(--seat-active)) 50%,transparent)}.seat-cell:hover .seat-cell__circle--active{box-shadow:0 0 12px color-mix(in srgb,var(--seat-color, var(--seat-active)) 70%,transparent)}.seat-cell__label{font-size:clamp(.4rem,1.5vw,.6rem);font-weight:600;color:var(--text-muted, #a0a0b0);pointer-events:none;line-height:1;white-space:nowrap}.modal-overlay{position:fixed;inset:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000}.modal{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:24px;min-width:260px;position:relative;display:flex;flex-direction:column;gap:16px}.modal__close{position:absolute;top:8px;right:12px;background:none;border:none;font-size:1.4rem;color:var(--text-muted);cursor:pointer;line-height:1}.modal__close:hover{color:var(--text)}.modal__title{font-size:1rem;font-weight:600}.modal__label{display:flex;flex-direction:column;gap:4px;font-size:.85rem;color:var(--text-muted)}.modal__input{background:var(--bg);border:1px solid var(--border);border-radius:6px;color:var(--text);padding:8px 10px;font-size:.95rem;outline:none;transition:border-color .2s}.modal__input:focus{border-color:var(--accent)}.modal__actions{display:flex;gap:8px}.modal__btn{flex:1;padding:8px 12px;border:none;border-radius:6px;font-size:.85rem;font-weight:600;cursor:pointer;transition:opacity .2s}.modal__btn:hover{opacity:.9}.modal__btn--clear{background:var(--border);color:var(--text)}.modal__btn--save{background:var(--accent);color:#fff}.seat-grid-container{display:flex;flex:1;gap:0}.seat-grid__stage{background:#3a3a5a;color:var(--text-muted);font-size:.75rem;font-weight:700;letter-spacing:.15em;text-transform:uppercase;border:1px solid var(--border);display:flex;align-items:center;justify-content:center;flex-shrink:0}.seat-grid{display:grid;grid-template-columns:auto repeat(var(--cols),1fr);gap:9px;padding:20px;background:var(--surface);border:1px solid var(--border);flex:1;align-content:start;max-width:100%;overflow:auto}.seat-grid-container--top{flex-direction:column}.seat-grid-container--top .seat-grid__stage{padding:6px 0;border-radius:var(--radius) var(--radius) 0 0;border-bottom:none}.seat-grid-container--top .seat-grid{border-radius:0 0 var(--radius) var(--radius)}.seat-grid-container--bottom{flex-direction:column-reverse}.seat-grid-container--bottom .seat-grid__stage{padding:6px 0;border-radius:0 0 var(--radius) var(--radius);border-top:none}.seat-grid-container--bottom .seat-grid{border-radius:var(--radius) var(--radius) 0 0}.seat-grid-container--left{flex-direction:row}.seat-grid-container--left .seat-grid__stage{writing-mode:vertical-rl;transform:rotate(180deg);padding:0 6px;border-radius:var(--radius) 0 0 var(--radius);border-right:none}.seat-grid-container--left .seat-grid{border-radius:0 var(--radius) var(--radius) 0}.seat-grid-container--right{flex-direction:row-reverse}.seat-grid-container--right .seat-grid__stage{writing-mode:vertical-rl;padding:0 6px;border-radius:0 var(--radius) var(--radius) 0;border-left:none}.seat-grid-container--right .seat-grid{border-radius:var(--radius) 0 0 var(--radius)}.seat-grid--label-right{grid-template-columns:repeat(var(--cols),1fr) auto}.seat-grid--label-right .seat-grid__row-label{flex-direction:row-reverse;padding-right:0;padding-left:4px}.seat-grid--header-bottom .seat-grid__col-header{flex-direction:column-reverse}.seat-grid__col-header{display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:.7rem;font-weight:600;color:var(--text-secondary, #999);-webkit-user-select:none;user-select:none;gap:2px}.seat-grid__row-label{display:flex;flex-direction:row;align-items:center;justify-content:center;font-size:.7rem;font-weight:600;color:var(--text-secondary, #999);-webkit-user-select:none;user-select:none;padding-right:4px;gap:4px}.seat-grid__gear{background:none;border:none;cursor:pointer;font-size:.65rem;color:var(--text-secondary, #999);opacity:0;transition:opacity .2s,color .2s;padding:0;line-height:1}.seat-grid__col-header:hover .seat-grid__gear,.seat-grid__row-label:hover .seat-grid__gear{opacity:1}.seat-grid__gear:hover{opacity:1;color:var(--accent)}.confirm-modal{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:24px;min-width:280px;display:flex;flex-direction:column;gap:16px}.confirm-modal__title{font-size:1rem;font-weight:600}.confirm-modal__message{font-size:.9rem;color:var(--text-muted);line-height:1.4}.confirm-modal__actions{display:flex;gap:8px}.confirm-modal__btn{flex:1;padding:8px 12px;border:none;border-radius:6px;font-size:.85rem;font-weight:600;cursor:pointer;transition:opacity .2s}.confirm-modal__btn:hover{opacity:.9}.confirm-modal__btn--cancel{background:var(--border);color:var(--text)}.confirm-modal__btn--confirm{background:#c0392b;color:#fff}.app{display:flex;flex-direction:column;min-height:100vh;padding:24px;gap:24px;max-width:1200px;margin:0 auto}.app__header{text-align:center}.app__title{font-size:1.8rem;font-weight:700;letter-spacing:-.02em}.app__subtitle{color:var(--text-muted);font-size:.9rem;margin-top:4px}.app__body{display:flex;flex-direction:column;gap:24px;flex:1}@media(max-width:768px){.app{padding:16px;gap:16px}}
