:root{--color-bg: #f7f4ef;--color-bg-alt: #efeae3;--color-surface: #ffffff;--color-border: #d6d0c6;--color-border-light: #e8e4dc;--color-text: #2c2a26;--color-text-secondary: #7a756b;--color-text-tertiary: #a8a298;--color-accent: #5b8a8c;--color-accent-warm: #b08d57;--color-chapter: #8b7355;--color-scene: #6b8e6b;--color-speaker: #4a6b7a;--color-action: #7a6b4a;--color-sfx: #7a4a5b;--color-wait: #8a8279;--color-bg-indicator: #6b8a6b;--color-active: #f0ebdf;--color-playing: #e8e0d0;--font-sans: "Noto Sans JP", system-ui, sans-serif;--font-serif: "Noto Serif JP", Georgia, serif;--font-mono: ui-monospace, "SFMono-Regular", monospace;--fw-light: 300;--fw-regular: 400;--fw-medium: 500;--fw-bold: 700;--sp-xs: 4px;--sp-sm: 8px;--sp-md: 16px;--sp-lg: 24px;--sp-xl: 32px;--sp-2xl: 48px;--radius-sm: 2px;--radius-md: 4px;--radius-lg: 6px;--shadow-sm: 0 1px 2px rgba(44, 42, 38, .06);--shadow-md: 0 2px 8px rgba(44, 42, 38, .08)}.header{display:flex;align-items:center;justify-content:space-between;height:48px;padding:0 var(--sp-lg);background:var(--color-surface);border-bottom:1px solid var(--color-border);flex-shrink:0}.header-left{display:flex;align-items:center;gap:var(--sp-md)}.header-logo{font-family:var(--font-serif);font-weight:var(--fw-bold);font-size:16px;color:var(--color-text);background:none;border:none;cursor:pointer;padding:0;letter-spacing:.04em}.header-logo:hover{color:var(--color-accent)}.header-title{font-size:14px;color:var(--color-text-secondary);font-weight:var(--fw-regular)}.header-right{display:flex;align-items:center;gap:var(--sp-md)}.header-counter{font-family:var(--font-mono);font-size:12px;color:var(--color-text-tertiary)}.header-diag{font-size:11px;color:var(--color-accent-warm);font-weight:var(--fw-medium)}.header-btn{font-size:12px;padding:var(--sp-xs) var(--sp-sm);border:1px solid var(--color-border);border-radius:var(--radius-md);background:var(--color-surface);color:var(--color-text-secondary);cursor:pointer;font-family:var(--font-sans)}.header-btn:hover{background:var(--color-bg-alt);color:var(--color-text)}.app-layout{display:flex;flex-direction:column;height:100vh}.app-main{flex:1;overflow-y:auto;background:var(--color-bg);padding:var(--sp-lg)}.error-screen{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100vh;gap:var(--sp-md);color:var(--color-text);font-family:var(--font-sans)}.error-screen button{padding:var(--sp-sm) var(--sp-lg);border:1px solid var(--color-border);border-radius:var(--radius-md);background:var(--color-surface);cursor:pointer;font-family:var(--font-sans)}.conte-sheet{max-width:900px;margin:0 auto}.conte-characters{display:flex;flex-wrap:wrap;gap:var(--sp-sm);margin-bottom:var(--sp-lg);padding:var(--sp-md);background:var(--color-surface);border:1px solid var(--color-border-light);border-radius:var(--radius-md)}.conte-character-badge{font-size:13px;font-weight:var(--fw-medium);color:var(--color-speaker)}.conte-character-desc{font-weight:var(--fw-regular);color:var(--color-text-tertiary);font-size:12px}.conte-marker{padding:var(--sp-sm) var(--sp-md);margin:var(--sp-xs) 0}.conte-marker-label{font-size:10px;font-weight:var(--fw-bold);letter-spacing:.1em;text-transform:uppercase;margin-right:var(--sp-sm)}.conte-marker-name{font-weight:var(--fw-medium);font-size:14px}.conte-marker-desc{font-size:12px;color:var(--color-text-tertiary);margin-left:var(--sp-sm)}.conte-marker-icon{margin-right:var(--sp-xs);font-size:12px}.conte-marker--title{text-align:center;padding:var(--sp-lg) var(--sp-md);margin-bottom:var(--sp-md)}.conte-marker--title .conte-marker-name{font-family:var(--font-serif);font-size:20px;font-weight:var(--fw-bold);color:var(--color-text)}.conte-marker--chapter{background:var(--color-chapter);color:#fff;border-radius:var(--radius-sm);margin-top:var(--sp-lg);margin-bottom:var(--sp-xs)}.conte-marker--chapter .conte-marker-label{color:#ffffffb3}.conte-marker--chapter .conte-marker-name{color:#fff}.conte-marker--chapter .conte-marker-desc{color:#fff9}.conte-marker--scene{background:var(--color-bg-alt);border-left:3px solid var(--color-scene);border-radius:var(--radius-sm);margin-top:var(--sp-sm);margin-bottom:var(--sp-xs)}.conte-marker--scene .conte-marker-label{color:var(--color-scene)}.conte-marker--scene .conte-marker-name{color:var(--color-text)}.conte-marker--bg{font-size:12px;color:var(--color-bg-indicator);padding:var(--sp-xs) var(--sp-md) var(--sp-xs) var(--sp-xl)}.conte-marker--bg-stop{color:var(--color-text-tertiary);text-decoration:line-through}.conte-marker--end{text-align:center;padding:var(--sp-lg) var(--sp-md);margin-top:var(--sp-lg)}.conte-marker--end .conte-marker-label{color:var(--color-text-tertiary);font-size:12px}.conte-frame{display:grid;grid-template-columns:48px 100px 1fr 64px;align-items:center;gap:var(--sp-sm);padding:var(--sp-sm) var(--sp-md);margin:1px 0;background:var(--color-surface);border-radius:var(--radius-sm);min-height:40px;transition:background .15s ease}.conte-frame--active{background:var(--color-active);box-shadow:inset 3px 0 0 var(--color-accent)}.conte-frame-number{font-family:var(--font-mono);font-size:12px;color:var(--color-text-tertiary);text-align:center;font-variant-numeric:tabular-nums}.conte-frame--active .conte-frame-number{color:var(--color-accent);font-weight:var(--fw-bold)}.conte-frame-speaker{font-size:13px;font-weight:var(--fw-medium);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.conte-speaker-name{color:var(--color-speaker)}.conte-type-label{font-size:11px;font-weight:var(--fw-bold);letter-spacing:.05em;text-transform:uppercase}.conte-frame--direction .conte-type-label{color:var(--color-action)}.conte-frame--sfx .conte-type-label{color:var(--color-sfx)}.conte-frame--pause .conte-type-label{color:var(--color-wait)}.conte-frame-content{font-size:14px;color:var(--color-text);line-height:1.6;overflow:hidden}.conte-dialogue-text{font-weight:var(--fw-regular)}.conte-direction-text{color:var(--color-text-secondary);font-style:italic}.conte-sfx-name{font-weight:var(--fw-medium);color:var(--color-sfx)}.conte-sfx-desc{color:var(--color-text-tertiary);font-size:12px}.conte-pause-line{display:block;height:1px;background:var(--color-border);width:60%;margin:var(--sp-sm) 0}.conte-frame-timing{display:flex;flex-direction:column;align-items:flex-end;gap:2px;font-family:var(--font-mono);font-variant-numeric:tabular-nums}.conte-duration{font-size:12px;color:var(--color-text-secondary)}.conte-timestamp{font-size:10px;color:var(--color-text-tertiary)}.player{display:flex;align-items:center;gap:var(--sp-md);height:52px;padding:0 var(--sp-lg);background:var(--color-surface);border-top:1px solid var(--color-border);flex-shrink:0}.player-controls{display:flex;align-items:center;gap:var(--sp-xs)}.player-btn{width:32px;height:32px;display:flex;align-items:center;justify-content:center;border:1px solid var(--color-border);border-radius:var(--radius-md);background:var(--color-surface);color:var(--color-text);cursor:pointer;font-size:14px;font-family:var(--font-sans);transition:background .1s ease}.player-btn:hover{background:var(--color-bg-alt)}.player-btn--play{width:36px;height:36px;border-color:var(--color-accent);color:var(--color-accent)}.player-btn--play:hover{background:var(--color-accent);color:#fff}.player-progress{flex:1}.player-progress-bar{height:4px;background:var(--color-border-light);border-radius:2px;overflow:hidden}.player-progress-fill{height:100%;background:var(--color-accent);border-radius:2px;transition:width .2s ease}.player-info{display:flex;flex-direction:column;align-items:flex-end;gap:2px;min-width:80px}.player-position{font-family:var(--font-mono);font-size:12px;color:var(--color-text-secondary);font-variant-numeric:tabular-nums}.player-time{font-family:var(--font-mono);font-size:10px;color:var(--color-text-tertiary);font-variant-numeric:tabular-nums}.player-speed{display:flex;gap:2px}.player-speed-btn{font-size:11px;padding:var(--sp-xs) 6px;border:1px solid var(--color-border-light);border-radius:var(--radius-sm);background:var(--color-surface);color:var(--color-text-tertiary);cursor:pointer;font-family:var(--font-mono);font-variant-numeric:tabular-nums;transition:all .1s ease}.player-speed-btn:hover{color:var(--color-text);border-color:var(--color-border)}.player-speed-btn--active{background:var(--color-accent);color:#fff;border-color:var(--color-accent)}.dropzone{display:flex;align-items:center;justify-content:center;height:100vh;background:var(--color-bg);transition:background .2s ease}.dropzone--active{background:var(--color-active)}.dropzone-content{text-align:center;max-width:400px}.dropzone-title{font-family:var(--font-serif);font-size:36px;font-weight:var(--fw-bold);color:var(--color-text);margin:0 0 var(--sp-xs);letter-spacing:.06em}.dropzone-subtitle{font-size:13px;color:var(--color-text-tertiary);margin:0 0 var(--sp-2xl);letter-spacing:.02em}.dropzone-area{padding:var(--sp-2xl) var(--sp-xl);border:2px dashed var(--color-border);border-radius:var(--radius-lg);background:var(--color-surface);margin-bottom:var(--sp-xl);transition:border-color .2s ease}.dropzone--active .dropzone-area{border-color:var(--color-accent)}.dropzone-hint{font-size:14px;color:var(--color-text-secondary);margin:0 0 var(--sp-md)}.dropzone-or{font-size:12px;color:var(--color-text-tertiary);margin:0 0 var(--sp-md)}.dropzone-btn{font-size:14px;padding:var(--sp-sm) var(--sp-lg);border:1px solid var(--color-accent);border-radius:var(--radius-md);background:var(--color-surface);color:var(--color-accent);cursor:pointer;font-family:var(--font-sans);font-weight:var(--fw-medium);transition:all .15s ease}.dropzone-btn:hover{background:var(--color-accent);color:#fff}.dropzone-demo{font-size:13px;color:var(--color-text-tertiary);background:none;border:none;cursor:pointer;font-family:var(--font-sans);text-decoration:underline;text-underline-offset:3px;transition:color .15s ease}.dropzone-demo:hover{color:var(--color-accent)}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{font-family:var(--font-sans);font-weight:var(--fw-regular);font-size:14px;color:var(--color-text);background:var(--color-bg);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{min-height:100vh}::selection{background:#5b8a8c33}