:root{color-scheme:light;--ink: #252139;--muted: #716a7c;--paper: #fbf8f2;--paper-deep: #f1ebdf;--lavender: #dcd5f1;--lavender-deep: #9e8bcf;--teal: #b7e2dc;--teal-deep: #2f7f79;--coral: #e39a86;--line: #d8d0c4;--shadow: 0 20px 45px rgba(70, 53, 79, .11);font-family:Inter,ui-rounded,Hiragino Maru Gothic ProN,Yu Gothic,sans-serif;font-synthesis:none}*{box-sizing:border-box}html{min-width:320px;background:#e9e1ed;scroll-behavior:smooth}body{min-width:320px;margin:0;color:var(--ink);background:radial-gradient(circle at 14% 9%,rgba(255,255,255,.82) 0 5px,transparent 6px),radial-gradient(circle at 76% 22%,rgba(167,143,198,.18) 0 2px,transparent 3px),#e9e1ed;line-height:1.7}body:before{position:fixed;z-index:-1;inset:0;pointer-events:none;content:"";opacity:.38;background-image:repeating-linear-gradient(0deg,transparent 0 31px,rgba(139,109,146,.08) 32px)}button,input{font:inherit}button{cursor:pointer}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid #2c746e;outline-offset:3px}a{color:#276d68;text-decoration-thickness:2px;text-underline-offset:3px}.skip-link{position:fixed;z-index:20;top:10px;left:10px;padding:8px 14px;color:#fff;background:var(--ink);border-radius:8px;transform:translateY(-160%)}.skip-link:focus{transform:translateY(0)}.page-shell{width:min(1220px,calc(100% - 36px));margin:0 auto;padding:38px 0 28px}.site-header,.workspace-heading,.saved-heading,.search-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:20px}.site-header{position:relative;min-height:142px;padding:18px 18px 26px 34px;border-bottom:2px solid rgba(47,127,121,.35)}.site-header:before{position:absolute;top:0;left:20px;width:92px;height:12px;content:"";background:var(--coral);opacity:.7;transform:rotate(-3deg)}.eyebrow,.section-kicker{margin:0 0 8px;color:var(--teal-deep);font-size:.72rem;font-weight:800;letter-spacing:.18em;text-transform:uppercase}.brand-lockup h1{margin:0;font-family:Georgia,Hiragino Mincho ProN,serif;font-size:clamp(2.3rem,5vw,4.6rem);font-weight:600;letter-spacing:.04em;line-height:1.06}.brand-subtitle{margin:12px 0 0;color:var(--muted);font-size:.97rem}.header-stamp{display:grid;min-width:154px;padding:14px 18px 12px;color:#315e5c;background:var(--teal);border:1px solid rgba(47,127,121,.24);border-radius:5px 18px;box-shadow:7px 7px #6c5b8f29;text-align:center;transform:rotate(2deg)}.header-stamp span{font-family:Georgia,serif;font-size:.72rem;letter-spacing:.1em;text-transform:uppercase}.header-stamp strong{font-size:.95rem}.intro-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:26px;margin:32px 0 54px}.paper-panel{position:relative;background:var(--paper);border:1px solid rgba(116,96,117,.2);box-shadow:var(--shadow)}.intro-copy{padding:clamp(26px,5vw,54px);transform:rotate(-.45deg)}.intro-copy h2,.workspace-heading h2,.notes-grid h2{margin:0;font-family:Georgia,Hiragino Mincho ProN,serif;font-weight:600;line-height:1.25}.intro-copy h2{max-width:580px;font-size:clamp(2rem,4vw,3.35rem)}.intro-copy>p:not(.section-kicker){max-width:590px;margin:20px 0 0;color:var(--muted)}.intro-copy .scope-note{max-width:620px;padding:9px 12px;color:#4c4659;background:#dcd5f175;border-left:3px solid var(--lavender-deep);font-size:.86rem}.intro-steps{display:flex;flex-wrap:wrap;gap:9px 18px;margin-top:30px;color:#4c4659;font-size:.87rem}.intro-steps span{display:inline-flex;align-items:center;gap:7px}.intro-steps b{display:grid;width:27px;height:27px;place-items:center;color:var(--ink);background:var(--lavender);border-radius:50%;font-size:.7rem}.decorative-figure{display:flex;min-height:280px;margin:16px 16px 0 0;padding:30px 22px 16px;align-items:center;justify-content:center;flex-direction:column;overflow:hidden;background:#f6f0e6;transform:rotate(1.5deg)}.tape{position:absolute;z-index:1;width:90px;height:25px;background:#e0c59699;transform:rotate(-9deg)}.tape-top{top:-7px;left:39%}.decorative-image{display:block;width:min(100%,520px);height:auto;mix-blend-mode:multiply;opacity:.78}.decorative-figure.image-missing:before{display:grid;width:100%;min-height:190px;place-items:center;color:var(--muted);content:"紙の余白に、今日の音をメモする";font-family:Georgia,serif;font-size:1.2rem;text-align:center}.decorative-figure figcaption{margin-top:10px;color:var(--muted);font-size:.73rem}.workspace{padding:0 0 18px}.workspace-heading{align-items:center;margin-bottom:22px}.workspace-heading h2{font-size:clamp(1.75rem,3vw,2.5rem)}.text-button{min-height:44px;padding:8px 14px;color:var(--teal-deep);background:transparent;border:0;border-bottom:1px dashed currentColor}.pair-picker{display:grid;grid-template-columns:.34fr 1fr;gap:22px;align-items:center;margin-bottom:20px;padding:18px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.picker-label{display:grid;gap:2px}.picker-label>span{font-weight:800}.picker-label small,.field-hint,.saved-help{color:var(--muted);font-size:.82rem}.pair-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.pair-button{position:relative;display:grid;min-height:80px;padding:13px 17px;color:var(--ink);background:#fbf8f2b8;border:1px solid var(--line);border-radius:2px 14px;text-align:left;transition:transform .16s ease,border-color .16s ease,box-shadow .16s ease}.pair-button:hover{transform:translateY(-2px) rotate(-.5deg)}.pair-button.is-selected{background:var(--lavender);border-color:var(--lavender-deep);box-shadow:5px 5px #7e67a92e}.pair-type{color:var(--teal-deep);font-size:.72rem;font-weight:800;letter-spacing:.13em}.pair-button strong{font-family:Georgia,serif;font-size:1.4rem;font-weight:600}.pair-button strong i,.saved-item-copy i{color:var(--muted);font-size:.72em;font-style:normal}.pair-button small{color:var(--muted);font-size:.78rem}.search-box{margin:26px 0 24px;padding:22px 24px 18px;border-left:5px solid var(--teal-deep);transform:rotate(.25deg)}.search-heading h3,.speech-toolbar h3,.saved-section h3{margin:0;font-size:1.25rem}.limit-badge,.count-badge{display:inline-flex;min-height:29px;align-items:center;padding:3px 9px;color:#48605f;background:var(--teal);border-radius:999px;font-size:.76rem;font-weight:800}.search-form{display:grid;grid-template-columns:1fr auto;gap:10px;margin-top:14px}.search-input-wrap input{width:100%;min-height:48px;padding:9px 14px;color:var(--ink);background:#fffdf9;border:1px solid #bdb3c4;border-radius:2px;font-size:16px}.primary-button,.secondary-button,.small-button,.play-button{min-height:44px;border-radius:3px 11px;font-weight:800}.primary-button{padding:9px 18px;color:#fff;background:var(--teal-deep);border:1px solid var(--teal-deep);box-shadow:3px 3px #2f7f7938}.primary-button:hover,.play-button:hover{background:#276d68}.secondary-button{padding:8px 14px;color:var(--ink);background:transparent;border:1px solid #aaa0b3}.secondary-button[aria-pressed=true]{color:#fff;background:var(--ink);border-color:var(--ink)}.search-target{display:flex;flex-wrap:wrap;gap:10px 15px;align-items:center;margin-top:12px;color:var(--muted);font-size:.85rem}.search-target label{display:inline-flex;min-height:35px;align-items:center;gap:5px;color:var(--ink)}.field-hint{margin:8px 0 0}.feedback{min-height:1.6em;margin-top:7px;color:var(--teal-deep);font-size:.87rem}.feedback-too-long,.feedback-unsupported,.feedback-empty,.feedback-warning{color:#9a4f42}.search-results{display:grid;gap:8px;margin-top:8px}.search-result,.saved-item{display:flex;align-items:center;justify-content:space-between;gap:13px;padding:11px 12px;background:#dcd5f15c;border:1px dashed rgba(126,103,169,.44)}.search-result>div:first-child,.saved-item-copy{display:grid;gap:2px}.search-result strong,.saved-item-copy>span{font-family:Georgia,serif;font-size:1.15rem}.search-result span,.saved-item-copy small{color:var(--muted);font-size:.78rem}.result-actions,.saved-item-actions{display:flex;flex-wrap:wrap;gap:7px}.small-button{padding:7px 10px;color:var(--teal-deep);background:var(--paper);border:1px solid rgba(47,127,121,.45);font-size:.78rem}.danger-button{color:#9a4f42;border-color:#9a4f4266}.comparison-grid{position:relative;display:grid;grid-template-columns:minmax(0,1fr) 34px minmax(0,1fr);gap:16px;align-items:stretch}.sound-panel{position:relative;display:grid;min-width:0;align-content:start;padding:26px 22px 22px;background:var(--paper);border:1px solid rgba(116,96,117,.22);box-shadow:var(--shadow)}.panel-left{border-top:7px solid var(--lavender-deep);transform:rotate(-.55deg)}.panel-right{border-top:7px solid var(--teal-deep);transform:rotate(.55deg)}.panel-tab{position:absolute;top:-18px;left:22px;padding:4px 13px;color:#4c4659;background:var(--paper-deep);border:1px solid var(--line);font-size:.72rem;font-weight:800;letter-spacing:.08em;transform:rotate(-2deg)}.sound-category{color:var(--muted);font-size:.8rem;font-weight:800;letter-spacing:.08em}.sound-heading h3{margin:3px 0 2px;font-family:Georgia,serif;font-size:clamp(2.7rem,6vw,4.3rem);font-weight:500;line-height:1.1}.sound-word{display:flex;flex-wrap:wrap;gap:9px;align-items:baseline;margin:0}.sound-word strong{font-size:1.3rem;letter-spacing:.04em}.sound-word span{color:var(--muted);font-size:.86rem}.diagram-figure{margin:18px 0 6px;padding:10px;background:#f1ece9;border:1px solid rgba(99,79,105,.16)}.diagram-title{display:flex;align-items:center;justify-content:space-between;padding:0 5px 4px;color:var(--ink);font-size:.8rem;font-weight:800}.diagram-pin{color:var(--teal-deep);font-size:.68rem}.mouth-diagram{display:block;width:100%;height:auto;max-height:240px}.diagram-figure figcaption{padding:2px 5px 0;color:var(--muted);font-size:.72rem}.svg-paper{fill:#fcf8f1;stroke:#d6c8c6;stroke-width:1}.svg-palate{fill:none;stroke:#b88998;stroke-width:3;stroke-linecap:round}.svg-lips{fill:#f1c7bf;stroke:#a86e79;stroke-width:2}.svg-tongue{fill:#eaa7a5;stroke:#a86e79;stroke-width:2}.svg-tongue-r{fill:#dfa0b6}.svg-tongue-l{fill:#df9a98}.svg-ridge{fill:none;stroke:#6b9a96;stroke-width:5;stroke-linecap:round}.svg-air{fill:none;stroke:#5d9b95;stroke-width:2;stroke-linecap:round;stroke-dasharray:4 5}.svg-label{fill:#716a7c;font-size:9px;letter-spacing:.08em}.articulation-copy{display:grid;gap:8px;margin:12px 3px 17px}.articulation-copy p{margin:0}.contrast-copy{padding-left:11px;color:#4c4659;border-left:3px solid var(--lavender-deep);font-size:.9rem}.variation-note{color:var(--muted);font-size:.78rem}.play-button{display:inline-flex;width:100%;align-items:center;justify-content:center;gap:9px;margin-top:auto;padding:10px 14px;color:#fff;background:var(--teal-deep);border:1px solid var(--teal-deep)}.play-icon{font-size:.8rem}.play-button small{opacity:.8;font-weight:500}.versus-mark{display:grid;align-content:center;justify-items:center;color:var(--muted)}.versus-mark span{padding:8px 3px;font-family:Georgia,serif;font-size:.9rem;font-style:italic;writing-mode:vertical-rl}.versus-mark i{width:1px;height:44px;background:var(--line)}.speech-toolbar{display:grid;grid-template-columns:minmax(230px,1fr) auto;gap:15px 26px;align-items:center;margin-top:30px;padding:20px 22px;border-top:5px solid var(--coral)}.speech-disclaimer{margin:4px 0 0;color:#9a4f42;font-size:.82rem}.speech-controls{display:flex;flex-wrap:wrap;gap:9px;align-items:center;justify-content:flex-end}.volume-control{display:inline-flex;min-height:44px;align-items:center;gap:8px;color:var(--muted);font-size:.8rem}.volume-control input{width:130px;accent-color:var(--teal-deep)}.volume-control output{width:37px;color:var(--ink);font-variant-numeric:tabular-nums}.speech-status{grid-column:1 / -1;min-height:1.4em;margin:0;color:var(--muted);font-size:.8rem}.saved-section{margin-top:50px;padding:26px 0 8px;border-top:2px solid rgba(47,127,121,.3)}.saved-heading{align-items:center}.saved-help{margin:6px 0 13px}.saved-actions{display:flex;flex-wrap:wrap;gap:9px;margin-bottom:4px}.saved-list{display:grid;gap:9px;margin-top:9px}.notes-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;margin:46px 0 35px}.note-card{min-height:210px;padding:25px 26px;border:1px solid rgba(116,96,117,.2);box-shadow:8px 10px #5542641a}.note-card-lavender{background:var(--lavender);transform:rotate(-.65deg)}.note-card-teal{background:var(--teal);transform:rotate(.65deg)}.notes-grid h2{font-size:1.6rem}.note-card ul{margin:15px 0 0;padding-left:1.2em}.note-card li+li{margin-top:5px}.note-card p:not(.section-kicker){margin:15px 0 0;font-size:.88rem}.source-block{margin-top:15px;padding-top:10px;border-top:1px dashed rgba(47,127,121,.38)}.source-label{margin:0!important;color:#315e5c;font-size:.78rem!important;font-weight:800}.source-list{margin:6px 0 0;padding-left:1.15em;font-size:.76rem}.source-list li+li{margin-top:3px}.source-line{font-size:.78rem!important}.site-footer{display:flex;justify-content:space-between;gap:15px;padding:19px 4px 0;color:var(--muted);border-top:1px solid rgba(47,127,121,.3);font-size:.76rem}.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}@media(max-width:900px){.intro-grid{grid-template-columns:1fr}.decorative-figure{min-height:210px;margin-right:0}.decorative-image{max-height:180px;object-fit:contain}.pair-picker{grid-template-columns:1fr;gap:10px}}@media(max-width:700px){.page-shell{width:min(100% - 24px,600px);padding-top:18px}.site-header{min-height:0;padding:15px 6px 22px 16px}.header-stamp{min-width:104px;padding:8px 9px}.header-stamp strong{font-size:.78rem}.brand-subtitle{font-size:.85rem}.intro-grid{gap:14px;margin:21px 0 38px}.intro-copy{padding:25px 22px}.intro-copy h2{font-size:clamp(1.85rem,9vw,2.8rem)}.pair-options,.notes-grid{grid-template-columns:1fr}.search-box{padding:19px 16px 15px}.comparison-grid{grid-template-columns:1fr;gap:29px}.versus-mark{display:flex;height:26px;flex-direction:row;gap:8px}.versus-mark span{writing-mode:initial}.versus-mark i{width:45px;height:1px}.speech-toolbar{grid-template-columns:1fr;gap:12px;padding:18px 16px}.speech-controls{justify-content:flex-start}.speech-status{grid-column:auto}.search-result,.saved-item{align-items:flex-start;flex-direction:column}.result-actions,.saved-item-actions{width:100%}.small-button{flex:1}}@media(max-width:430px){.page-shell{width:calc(100% - 18px)}.site-header{align-items:flex-start;flex-direction:column;gap:15px}.header-stamp{align-self:flex-end}.search-form{grid-template-columns:1fr}.primary-button{width:100%}.sound-panel{padding:25px 14px 16px}.sound-heading h3{font-size:3.2rem}.volume-control{width:100%}.volume-control input{flex:1}.site-footer{align-items:flex-start;flex-direction:column;gap:2px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}@media print{html,body{background:#fff}body:before,.skip-link,.site-header:before,.header-stamp,.decorative-figure,.workspace-heading .text-button,.pair-picker,.search-box,.speech-toolbar,.saved-actions,.saved-help,.saved-item-actions,.site-footer,.note-card{display:none!important}.page-shell{width:100%;padding:0}.site-header{min-height:0;padding:0 0 12px}.intro-grid,.notes-grid{display:block;margin:15px 0}.intro-copy{padding:0;box-shadow:none;transform:none}.comparison-grid{grid-template-columns:1fr 20px 1fr;gap:8px}.sound-panel{padding:14px;box-shadow:none;transform:none}.saved-section{margin-top:18px}.saved-item{break-inside:avoid}}