:root{font-synthesis:none;text-rendering:optimizelegibility;font-family:Arial,Helvetica,sans-serif}html,body,#root{min-width:320px;min-height:100%}body{margin:0}*{box-sizing:border-box}:root{color:#20242a;font-synthesis:none;background:#eef1f5;font-family:Arial,Helvetica,sans-serif}body{background:#eef1f5;min-width:320px;min-height:100vh;margin:0}button,input,textarea,select{font:inherit}button{color:inherit}.topbar{justify-content:space-between;align-items:flex-start;gap:20px;margin-bottom:18px;display:flex}.topbar h1{color:#17202b;margin:0;font-size:clamp(27px,4vw,42px)}.topbar p{color:#5f6977;margin:7px 0 0;line-height:1.45}.toolbar{flex-wrap:wrap;justify-content:flex-end;gap:8px;display:flex}.toolbar button,.small-button{cursor:pointer;background:#fff;border:1px solid #b7bec9;border-radius:8px;padding:9px 12px}.toolbar button:hover:not(:disabled),.small-button:hover:not(:disabled){background:#f5f7fa;border-color:#7b8798}.toolbar button:disabled,.small-button:disabled{opacity:.45;cursor:default}.primary-button{color:#fff!important;background:#202a36!important;border-color:#202a36!important}.status{color:#46576c;min-height:20px;margin:8px 0 0;font-size:14px}.preview-panel{background:#fff;border-radius:14px;padding:18px;box-shadow:0 8px 28px #141f2d14}.preview-heading{justify-content:space-between;align-items:center;gap:15px;margin-bottom:12px;display:flex}.preview-heading h2{margin:0;font-size:17px}.plain-preview{white-space:nowrap;background:#f8fafc;border:1px solid #d3d8e0;border-radius:9px;justify-content:center;align-items:center;gap:11px;min-height:74px;padding:14px;font-family:Segoe UI,Arial Unicode MS,sans-serif;font-size:18px;display:flex;overflow-x:auto}.preview-slot-content{align-items:center;gap:8px;display:inline-flex}.preview-symbol-group,.preview-symbol,.preview-boundary,.preview-empty{display:inline-block}.preview-operator{flex:none;font-weight:600}.preview-matrix-stack{vertical-align:middle;place-items:center;gap:3px;display:inline-grid}.preview-matrix-label{min-height:17px;font-size:14px;font-weight:700;line-height:1;display:block}.preview-feature-matrix{vertical-align:middle;align-items:stretch;gap:5px;min-width:92px;font-size:15px;line-height:1.25;display:inline-flex}.preview-matrix-bracket{color:#263342;align-content:stretch;font-family:Times New Roman,serif;font-size:22px;line-height:1;display:grid}.preview-matrix-bracket span{place-items:center;min-height:18px;display:grid}.preview-matrix-rows{align-content:center;gap:2px;padding:3px 0;display:grid}.preview-matrix-row{white-space:nowrap;display:block}.preview-matrix-empty{color:#8b95a2;white-space:nowrap;font-style:italic}.rule-layout{grid-template-columns:minmax(160px,1fr) auto minmax(160px,1fr) auto minmax(160px,1fr) auto minmax(160px,1fr);align-items:stretch;gap:10px;margin-top:14px;display:grid}.rule-operator{place-items:center;min-width:30px;font-size:28px;font-weight:700;display:grid}.rule-slot{text-align:left;cursor:pointer;background:#fff;border:2px solid #cdd3dc;border-radius:11px;min-width:0;min-height:150px;padding:12px}.rule-slot:hover{border-color:#8390a2}.slot-header{justify-content:space-between;align-items:center;gap:8px;margin-bottom:10px;display:flex}.slot-label{color:#5e6977;letter-spacing:.04em;text-transform:uppercase;margin:0;font-size:12px;font-weight:700;display:block}.slot-clipboard-controls{gap:4px;display:inline-flex}.slot-clipboard-controls button{color:#536174;cursor:pointer;background:#fff;border:1px solid #c3cad4;border-radius:6px;padding:4px 7px;font-size:11px;font-weight:700}.slot-clipboard-controls button:hover:not(:disabled){background:#edf2f7;border-color:#6f7e91}.slot-clipboard-controls button:disabled{opacity:.38;cursor:default}.slot-tokens{flex-wrap:wrap;align-items:flex-start;gap:8px;display:flex}.slot-direct-entry{grid-template-columns:minmax(0,1fr) 34px;gap:6px;margin-top:10px;display:grid}.slot-direct-entry input{background:#fbfcfd;border:1px dashed #aeb7c4;border-radius:7px;min-width:0;padding:8px 9px;font-size:12px}.slot-direct-entry button{cursor:pointer;background:#fff;border:1px solid #aeb7c4;border-radius:7px;font-weight:700}.slot-direct-entry button:hover{background:#edf2f7}.slot-blank{min-width:1px;min-height:1px;display:inline-block}.rule-token{cursor:pointer;background:#f8fafc;border:1px solid #c9d0da;border-radius:8px;align-items:center;min-height:58px;padding:8px 8px 24px;display:inline-flex;position:relative}.rule-token.symbol,.rule-token.boundary{justify-content:center;min-width:56px;font-family:Segoe UI,Arial Unicode MS,sans-serif;font-size:28px}.rule-token.matrix{align-items:flex-start;min-width:126px}.token-content{min-width:0}.token-inline-input{text-align:center;background:0 0;border:1px solid #0000;border-radius:5px;width:auto;min-width:34px;max-width:180px;padding:2px 4px;font-family:Segoe UI,Arial Unicode MS,sans-serif;font-size:27px}.token-inline-input:focus{background:#fff;border-color:#8390a2;outline:none}.token-controls{gap:2px;display:flex;position:absolute;bottom:2px;right:3px}.token-controls button{color:#687587;cursor:pointer;background:0 0;border:0;border-radius:4px;width:20px;height:19px;padding:0;font-size:14px;line-height:1}.token-controls button:hover:not(:disabled){color:#202a36;background:#e5e9ef}.token-controls button:disabled{opacity:.25;cursor:default}.matrix-editor-stack{justify-items:stretch;gap:4px;min-width:112px;display:inline-grid}.matrix-inline-category-row{grid-template-columns:repeat(4,minmax(24px,1fr));gap:3px;display:grid}.matrix-inline-category-button{color:#536174;cursor:pointer;background:#fff;border:1px solid #c2c9d2;border-radius:5px;min-width:0;padding:2px 4px;font-size:11px;font-weight:700;line-height:1.2}.matrix-inline-category-button:hover{background:#edf2f7;border-color:#6f7e91}.matrix-inline-category-button.selected{color:#fff;background:#25364b;border-color:#25364b}.matrix-label-input{text-align:center;background:0 0;border:1px solid #0000;border-radius:4px;width:100%;min-width:0;padding:1px 4px;font-size:13px;font-weight:700}.matrix-label-input:focus{background:#fff;border-color:#8390a2;outline:none}.matrix-editor-visual{min-width:104px;padding:4px 11px;position:relative}.matrix-editor-visual:before,.matrix-editor-visual:after{pointer-events:none;content:"";border-top:2px solid #263342;border-bottom:2px solid #263342;width:7px;position:absolute;top:0;bottom:0}.matrix-editor-visual:before{border-left:2px solid #263342;left:0}.matrix-editor-visual:after{border-right:2px solid #263342;right:0}.matrix-direct-textarea{resize:both;white-space:pre;background:0 0;border:1px solid #0000;border-radius:4px;width:100%;min-width:82px;max-width:210px;padding:2px 4px;font-family:Segoe UI,Arial Unicode MS,sans-serif;font-size:13px;line-height:1.28;display:block;overflow:auto}.matrix-direct-textarea:focus{background:#fff;border-color:#8390a2;outline:none}.empty-matrix{color:#8b95a2;font-style:italic}.workspace{grid-template-columns:230px minmax(0,1fr);gap:18px;margin-top:18px;display:grid}.left-panel,.picker-panel{background:#fff;border-radius:14px;box-shadow:0 8px 28px #141f2d14}.left-panel{align-self:start;padding:16px;position:sticky;top:12px}.left-panel h2,.picker-panel h2{margin:0;font-size:18px}.slot-list{gap:8px;margin-top:13px;display:grid}.slot-list button{text-align:left;cursor:pointer;background:#fff;border:1px solid #ccd2db;border-radius:8px;padding:11px}.slot-list button.active{background:#edf2f7;border-color:#25364b;font-weight:700}.left-panel hr{border:0;border-top:1px solid #dde2e8;margin:16px 0}.left-panel .small-button{width:100%;margin-top:7px}.picker-panel{min-width:0;overflow:hidden}.picker-tabs{border-bottom:1px solid #d9dee5;grid-template-columns:repeat(3,1fr);display:grid}.picker-tabs button{cursor:pointer;background:#f6f8fa;border:0;border-right:1px solid #e0e4e9;padding:14px 10px;font-weight:700}.picker-tabs button:last-child{border-right:0}.picker-tabs button.active{background:#fff;box-shadow:inset 0 -3px #25364b}.search-row{gap:8px;margin-bottom:18px;display:flex}.search-row input,.custom-row input{background:#fff;border:1px solid #bcc4cf;border-radius:8px;flex:1;min-width:0;padding:10px 11px}.group{margin-top:20px}.group:first-of-type{margin-top:0}.group h3{color:#384659;border-bottom:1px solid #dce1e7;margin:0 0 9px;padding-bottom:7px;font-size:14px}.symbol-grid{grid-template-columns:repeat(auto-fill,minmax(62px,1fr));gap:7px;display:grid}.symbol-button{cursor:pointer;background:#fff;border:1px solid #c6cdd7;border-radius:7px;min-height:47px;padding:6px;font-family:Segoe UI,Arial Unicode MS,sans-serif;font-size:21px}.symbol-button:hover{background:#f2f5f8;border-color:#53657b}.ipa-chart-section{overflow:hidden}.chart-key{color:#677382;margin:-2px 0 11px;font-size:12px}.ipa-chart-scroll{padding-bottom:6px;overflow-x:auto}.consonant-chart{border-top:1px solid #cbd2dc;border-left:1px solid #cbd2dc;grid-template-columns:128px repeat(11,minmax(64px,1fr));min-width:980px;display:grid}.chart-corner,.chart-column-heading,.vowel-column-heading,.chart-row-heading,.chart-cell,.vowel-cell{border-bottom:1px solid #cbd2dc;border-right:1px solid #cbd2dc}.chart-corner{background:#f2f5f8;min-height:52px}.chart-column-heading,.vowel-column-heading{color:#455266;text-align:center;writing-mode:vertical-rl;background:#f2f5f8;place-items:center;min-height:52px;padding:5px 3px;font-size:11px;font-weight:700;display:grid;transform:rotate(180deg)}.consonant-chart-row{display:contents}.chart-row-heading{color:#455266;background:#f7f9fb;align-items:center;padding:7px 9px;font-size:12px;font-weight:700;display:flex}.chart-cell,.vowel-cell{background:#fff;justify-content:center;align-items:center;gap:3px;min-height:56px;padding:4px;display:flex}.chart-symbol-button{border-color:#0000;min-width:27px;min-height:37px;padding:3px;font-size:20px}.chart-symbol-button:hover{border-color:#53657b}.vowel-chart{border-top:1px solid #cbd2dc;border-left:1px solid #cbd2dc;grid-template-columns:110px repeat(3,minmax(150px,1fr));max-width:760px;display:grid}.vowel-chart-row{display:contents}.vowel-column-heading{writing-mode:horizontal-tb;min-height:42px;transform:none}.vowel-cell{min-height:54px}.vowel-column-0{padding-right:24px}.vowel-column-2{padding-left:24px}.custom-row{border-top:1px solid #dce1e7;gap:8px;margin-top:18px;padding-top:16px;display:flex}.unary-heading{color:#536174;letter-spacing:.04em;text-transform:uppercase;margin:0 0 7px;font-size:12px;font-weight:700}.node-row{flex-wrap:wrap;gap:7px;margin-bottom:16px;display:flex}.node-button{cursor:pointer;background:#fff;border:1px solid #bfc7d1;border-radius:7px;padding:8px 10px;font-size:13px;font-weight:700}.node-button.selected{color:#fff;background:#25364b;border-color:#25364b}.matrix-note{color:#677382;margin:0 0 14px;font-size:13px;line-height:1.4}.advanced-feature-toggle{cursor:pointer;background:#f8fafc;border:1px solid #d2d8e0;border-radius:9px;align-items:flex-start;gap:9px;margin:0 0 16px;padding:11px 12px;display:flex}.advanced-feature-toggle input{cursor:pointer;width:18px;height:18px;margin:1px 0 0}.advanced-feature-toggle span{gap:3px;display:grid}.advanced-feature-toggle strong{color:#344255;font-size:13px}.advanced-feature-toggle small{color:#6a7584;font-size:12px;line-height:1.35}.matrix-direct-panel{background:#f8fafc;border:1px solid #d2d8e0;border-radius:9px;grid-template-columns:minmax(240px,.7fr) minmax(300px,1.3fr);gap:14px;margin:0 0 18px;padding:13px;display:grid}.matrix-category-row{flex-wrap:wrap;align-items:center;gap:6px;display:flex}.matrix-category-button{cursor:pointer;background:#fff;border:1px solid #bfc7d1;border-radius:7px;min-width:36px;height:33px;padding:0 8px;font-weight:700}.matrix-category-button.selected{color:#fff;background:#25364b;border-color:#25364b}.matrix-label-field{background:#fff;border:1px solid #bcc4cf;border-radius:7px;flex:1;min-width:120px;padding:7px 8px}.matrix-text-editor-label{color:#536174;gap:5px;font-size:12px;font-weight:700;display:grid}.matrix-text-editor{resize:vertical;background:#fff;border:1px solid #bcc4cf;border-radius:8px;width:100%;min-height:92px;padding:9px 10px;font-family:Segoe UI,Arial Unicode MS,sans-serif;font-size:13px;line-height:1.35}.feature-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;display:grid}.feature-item{border:1px solid #d7dce3;border-radius:8px;grid-template-columns:minmax(118px,1fr) auto auto minmax(72px,auto) auto;align-items:center;gap:4px;padding:5px 6px;display:grid}.feature-name{min-width:0;font-size:13px;line-height:1.25}.feature-node{color:#7b8796;font-size:11px}.value-button{cursor:pointer;background:#fff;border:1px solid #c2c9d2;border-radius:6px;min-width:30px;height:29px;padding:0 5px;font-size:13px}.variable-select,.custom-value-select{color:#263342;cursor:pointer;background:#fff;border:1px solid #c2c9d2;border-radius:6px;height:29px;padding:0 5px;font-size:12px}.variable-select{min-width:72px}.variable-select.selected{color:#fff;background:#25364b;border-color:#25364b}.custom-value-select{min-width:72px;height:auto;padding:9px 7px}.value-button.selected{color:#fff;background:#25364b;border-color:#25364b}.remove-feature{color:#8a3d3d}.boundary-grid{grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:9px;display:grid}.boundary-button{text-align:left;cursor:pointer;background:#fff;border:1px solid #c7ced8;border-radius:8px;grid-template-columns:45px 1fr;align-items:center;gap:8px;padding:11px;display:grid}.boundary-button:hover{background:#f2f5f8;border-color:#697a8e}.boundary-symbol{text-align:center;font-family:Segoe UI,Arial Unicode MS,sans-serif;font-size:25px}.boundary-name{color:#596677;font-size:13px}.preview-blank{min-width:10px;display:inline-block}.custom-feature-row input{flex:1;min-width:180px}@media (width<=1100px){.rule-layout{grid-template-columns:1fr}.rule-operator{min-height:34px}.rule-slot{min-height:110px}.workspace{grid-template-columns:1fr}.left-panel{position:static}.slot-list{grid-template-columns:repeat(4,1fr)}}@media (width<=700px){.app-shell{width:min(100% - 14px,1420px);margin-top:8px}.topbar{display:block}.toolbar{justify-content:flex-start;margin-top:14px}.preview-heading{flex-direction:column;align-items:flex-start}.picker-body{padding:12px}.slot-list{grid-template-columns:repeat(2,1fr)}.feature-list,.matrix-direct-panel{grid-template-columns:1fr}.feature-item{grid-template-columns:minmax(110px,1fr) auto auto minmax(72px,auto) auto}.custom-row,.search-row{flex-direction:column}.vowel-chart{grid-template-columns:86px repeat(3,minmax(90px,1fr));min-width:430px}.ipa-chart-section{overflow-x:auto}}:root{--page:#f7f3eb;--paper:#fffdf9;--ink:#202a34;--muted:#66717c;--navy:#214766;--navy-deep:#183a56;--blue:#347ba8;--coral:#df684e;--gold:#d49a2d;--teal:#268f87;--line:#ded5c9;--soft-blue:#eaf3f8;--soft-coral:#fbefeb;--soft-gold:#fbf4e5;--soft-teal:#e8f5f3;color:var(--ink);background:var(--page);font-family:Inter,Avenir Next,Segoe UI,Arial,Helvetica,sans-serif}body{color:var(--ink);background-color:var(--page);background-image:linear-gradient(#2147660b 1px,#0000 1px),linear-gradient(90deg,#2147660b 1px,#0000 1px);background-size:28px 28px}button,input,textarea,select{font-family:inherit}button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline-offset:2px;outline:3px solid #347ba847}.app-shell{width:min(1500px,100% - 48px);margin:16px auto 64px}.topbar.tool-hero{isolation:isolate;color:#fff;background:linear-gradient(118deg, var(--navy-deep) 0%, var(--navy) 58%, var(--blue) 100%);border:1px solid #ffffff1f;border-radius:22px;grid-template-columns:minmax(0,1fr) minmax(390px,auto);align-items:end;gap:28px;min-height:238px;margin-bottom:30px;padding:30px 32px;display:grid;position:relative;overflow:hidden;box-shadow:0 18px 42px #2c323624}.tool-hero:after{z-index:-1;background:linear-gradient(90deg, var(--coral) 0 25%, var(--gold) 25% 50%, var(--teal) 50% 75%, #79a8c6 75% 100%);content:"";height:5px;position:absolute;inset:auto 0 0}.hero-copy{z-index:2;max-width:760px;position:relative}.hero-meta-row{align-items:center;gap:10px;margin-bottom:24px;display:flex}.hero-kicker,.section-kicker{letter-spacing:.13em;text-transform:uppercase;font-size:11px;font-weight:800}.hero-kicker{color:#ffffffc7}.hero-badge{color:#fff;letter-spacing:.12em;background:#ffffff1f;border:1px solid #ffffff3d;border-radius:999px;padding:6px 12px;font-size:11px;font-weight:850}.topbar.tool-hero h1{color:#fff;letter-spacing:-.045em;max-width:780px;margin:0;font-size:clamp(40px,6vw,72px);font-weight:800;line-height:.98}.topbar.tool-hero p{color:#ffffffd1;max-width:690px;margin:18px 0 0;font-size:17px;line-height:1.52}.hero-orb,.hero-rule-mark{z-index:-1;pointer-events:none;position:absolute}.hero-orb{border-radius:50%}.hero-orb-one{background:#ffffff0e;border:2px solid #ffffff21;width:260px;height:260px;top:-84px;right:-42px}.hero-orb-two{background:#df684e38;width:245px;height:245px;bottom:-130px;right:185px}.hero-rule-mark{color:#ffffff1a;font-family:Georgia,Times New Roman,serif;font-size:104px;font-weight:700;top:36px;right:86px;transform:rotate(-8deg)}.toolbar.hero-toolbar{z-index:2;grid-template-columns:repeat(2,minmax(0,1fr));align-self:end;gap:9px;min-width:390px;display:grid;position:relative}.toolbar.hero-toolbar button,.toolbar.hero-toolbar .primary-button{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);border-radius:10px;min-height:44px;padding:10px 13px;font-size:13px;font-weight:750;color:#fff!important;background:#ffffff1a!important;border:1px solid #ffffff3d!important}.toolbar.hero-toolbar button:hover:not(:disabled){transform:translateY(-1px);background:#ffffff2e!important;border-color:#ffffff6b!important}.toolbar.hero-toolbar .primary-button{grid-column:1/-1;color:#fff!important;background:var(--coral)!important;border-color:var(--coral)!important}.toolbar.hero-toolbar .primary-button:hover:not(:disabled){background:#c9553e!important}.section-heading{align-items:center;gap:12px;display:flex}.section-number{color:#fff;border-radius:11px;flex:0 0 36px;place-items:center;width:36px;height:36px;font-size:14px;font-weight:850;display:grid;box-shadow:0 5px 12px #222b331f}.section-number-coral{background:var(--coral)}.section-number-teal{background:var(--teal)}.section-kicker{color:var(--coral);margin-bottom:2px;display:block}.compact-section-heading .section-kicker{color:var(--teal)}.section-heading h2{letter-spacing:-.025em;margin:0;font-size:23px}.compact-section-heading h2{font-size:20px}.preview-panel{background:var(--paper);border:1px solid var(--line);border-left:6px solid var(--coral);border-radius:16px;padding:22px;position:relative;overflow:hidden;box-shadow:0 12px 30px #37342f14}.preview-panel:after{background:var(--soft-coral);content:"";pointer-events:none;border-radius:50%;width:190px;height:190px;position:absolute;bottom:-72px;right:-48px}.preview-heading{z-index:1;margin-bottom:18px;position:relative}.status{color:#59636c;background:#f0ede7;border-radius:999px;min-height:28px;margin:0;padding:6px 10px;font-size:12px}.plain-preview{z-index:1;min-height:92px;color:var(--navy-deep);background-color:#fbfaf6;background-image:linear-gradient(#21476609 1px,#0000 1px),linear-gradient(90deg,#21476609 1px,#0000 1px);background-size:22px 22px;border:1px solid #d8d0c5;border-radius:12px;padding:19px 22px;font-family:Segoe UI,Arial Unicode MS,sans-serif;font-size:21px;position:relative;box-shadow:inset 0 0 0 1px #ffffffb3}.preview-operator{color:var(--coral);font-family:Georgia,Times New Roman,serif;font-size:26px;font-weight:800}.rule-layout{z-index:1;gap:11px;margin-top:18px;position:relative}.rule-operator{color:var(--navy);font-family:Georgia,Times New Roman,serif;font-size:31px}.rule-slot{background:#fffdf9f0;border:1px solid #d8d0c5;border-left-width:5px;border-radius:13px;min-height:165px;padding:14px;transition:transform .16s,box-shadow .16s,border-color .16s;position:relative;overflow:hidden;box-shadow:0 5px 14px #36332f0b}.rule-layout>.rule-slot:first-child{border-left-color:var(--coral)}.rule-layout>.rule-slot:nth-child(3){border-left-color:var(--blue)}.rule-layout>.rule-slot:nth-child(5){border-left-color:var(--gold)}.rule-layout>.rule-slot:nth-child(7){border-left-color:var(--teal)}.rule-slot:after{content:"";pointer-events:none;border-radius:50%;width:105px;height:105px;position:absolute;bottom:-44px;right:-34px}.rule-layout>.rule-slot:first-child:after{background:var(--soft-coral)}.rule-layout>.rule-slot:nth-child(3):after{background:var(--soft-blue)}.rule-layout>.rule-slot:nth-child(5):after{background:var(--soft-gold)}.rule-layout>.rule-slot:nth-child(7):after{background:var(--soft-teal)}.rule-slot:hover{border-color:#b5a99b;transform:translateY(-2px);box-shadow:0 10px 22px #36332f17}.rule-slot.active-slot{border-color:var(--navy);box-shadow:0 0 0 3px #347ba829,0 12px 24px #36332f1a}.slot-header,.slot-tokens,.slot-direct-entry{z-index:1;position:relative}.slot-label{color:var(--navy);letter-spacing:.09em;font-size:11px}.slot-clipboard-controls button{color:var(--navy);background:#fbfaf6;border-color:#d5cbbb}.slot-direct-entry input{color:var(--ink);background:#ffffffd1;border:1px dashed #bcb09f}.slot-direct-entry button{color:#fff;background:var(--navy);border-color:var(--navy)}.rule-token{background:#fff;border-color:#d7cec2;box-shadow:0 3px 8px #34302a0e}.rule-token.selected-token{border-color:var(--blue);box-shadow:0 0 0 2px #347ba82e}.workspace{grid-template-columns:250px minmax(0,1fr);gap:20px;margin-top:24px}.left-panel,.picker-panel{background:var(--paper);border:1px solid var(--line);border-radius:16px;box-shadow:0 12px 30px #37342f13}.left-panel{border-top:5px solid var(--teal);padding:18px}.left-panel hr{border-top-color:var(--line)}.slot-list button{color:var(--ink);background:#fbfaf6;border-color:#d9d0c4;font-weight:650}.slot-list button:hover{border-color:var(--teal);background:var(--soft-teal)}.slot-list button.active{color:#0c625d;background:var(--soft-teal);border-color:var(--teal);box-shadow:inset 4px 0 0 var(--teal)}.small-button,.toolbar button{transition:background .15s,border-color .15s,transform .15s}.left-panel .small-button{color:var(--navy);background:#fbfaf6;border-color:#d9d0c4;font-weight:700}.left-panel .small-button:hover:not(:disabled){color:#fff;background:var(--teal);border-color:var(--teal)}.picker-panel{border-top:5px solid var(--blue)}.picker-tabs{border-bottom-color:var(--line);background:#fbfaf6;padding:10px 10px 0}.picker-tabs button{color:#65707a;letter-spacing:.01em;background:0 0;border:0;border-radius:10px 10px 0 0;min-height:48px;font-size:13px;position:relative}.picker-tabs button:hover{color:var(--navy);background:#347ba80f}.picker-tabs button.active{color:var(--navy);box-shadow:inset 0 -4px 0 var(--blue), 0 -1px 0 var(--line), 1px 0 0 var(--line), -1px 0 0 var(--line);background:#fff}.picker-body{padding:20px}.search-row input,.custom-row input,.matrix-label-field,.matrix-text-editor,.variable-select,.custom-value-select{background:#fffefa;border-color:#cec4b7}.search-row input:focus,.custom-row input:focus,.matrix-label-field:focus,.matrix-text-editor:focus,.variable-select:focus,.custom-value-select:focus{border-color:var(--blue);outline:none;box-shadow:0 0 0 3px #347ba81f}.group h3{color:var(--navy);border-bottom-color:var(--line);font-size:15px}.group h3:before{vertical-align:1px;background:var(--coral);content:"";border-radius:50%;width:7px;height:7px;margin-right:8px;display:inline-block}.symbol-button,.node-button,.value-button,.matrix-category-button,.boundary-button{background:#fffefa;border-color:#d5ccbf;transition:transform .13s,box-shadow .13s,background .13s,border-color .13s}.symbol-button:hover,.node-button:hover,.boundary-button:hover{border-color:var(--blue);background:var(--soft-blue);transform:translateY(-1px);box-shadow:0 5px 10px #2f445214}.node-button.selected,.value-button.selected,.variable-select.selected,.matrix-category-button.selected{color:#fff;background:var(--navy);border-color:var(--navy)}.advanced-feature-toggle,.matrix-direct-panel{border-color:var(--line);background:#fbfaf6}.advanced-feature-toggle:has(input:checked){background:var(--soft-blue);border-color:#a7c6d9}.feature-item{background:#fffefa;border-color:#ddd4c8}.feature-item:hover{border-color:#b9ad9f;box-shadow:0 4px 10px #37342f0e}.boundary-button{border-left:4px solid var(--gold)}.boundary-symbol{color:var(--gold);font-weight:800}.consonant-chart,.vowel-chart{border-color:#cfc5b8;border-radius:10px;overflow:hidden}.chart-corner,.chart-column-heading,.vowel-column-heading{color:#fff;background:var(--navy);border-color:#ffffff29}.chart-row-heading{color:var(--navy);background:#f2eee7;border-color:#d8cfc3}.chart-cell,.vowel-cell{background:#fffefa;border-color:#ded5c9}.empty-chart-cell{background:#f3efe8}.chart-symbol-button{background:0 0}.picker-panel,.ipa-chart-scroll,.history-list{scrollbar-color:#b8ab9b transparent;scrollbar-width:thin}@media (width<=1120px){.topbar.tool-hero{grid-template-columns:1fr;min-height:auto}.toolbar.hero-toolbar{width:min(100%,650px);min-width:0}.hero-rule-mark{right:42px}}@media (width<=700px){.app-shell{width:min(100% - 16px,1500px);margin-top:8px}.topbar.tool-hero{border-radius:16px;padding:24px 20px}.topbar.tool-hero h1{font-size:clamp(39px,12vw,58px)}.topbar.tool-hero p{font-size:15px}.toolbar.hero-toolbar{grid-template-columns:1fr 1fr}.preview-panel,.left-panel,.picker-panel{border-radius:13px}.preview-panel{padding:16px}.section-heading h2{font-size:20px}.plain-preview{justify-content:flex-start;font-size:18px}.workspace{gap:14px}}@media (width<=480px){.toolbar.hero-toolbar{grid-template-columns:1fr}.toolbar.hero-toolbar .primary-button{grid-column:auto}.hero-meta-row{flex-direction:column;align-items:flex-start}.section-number{flex-basis:32px;width:32px;height:32px}}.plain-preview{align-items:center;padding-top:32px;padding-bottom:20px}.preview-slot-content{justify-content:center;align-items:center;gap:10px;min-height:58px;line-height:1;display:inline-flex}.preview-symbol-group,.preview-symbol,.preview-boundary,.preview-blank{justify-content:center;align-items:center;min-height:58px;line-height:1;display:inline-flex}.preview-operator{justify-content:center;align-self:center;align-items:center;min-width:24px;min-height:58px;line-height:1;display:inline-flex}.preview-matrix-stack{align-items: ;vertical-align:middle;justify-content:center;align-self:center;gap:0;display:inline-flex;position:relative}.preview-matrix-label{white-space:nowrap;min-height:0;margin:0;line-height:1;position:absolute;bottom:calc(100% + 4px);left:50%;transform:translate(-50%)}.preview-feature-matrix{vertical-align:middle;justify-content:center;align-items:stretch;min-height:44px;margin:0;display:inline-flex}.preview-matrix-bracket,.preview-matrix-rows{align-self:stretch}.preview-matrix-rows{justify-content:center;min-height:100%}@media (width<=720px){.plain-preview{justify-content:flex-start;padding-top:30px}}