/* Interactive comparison for note 02. */
.note-action{min-width:0;margin:1.6rem 0 2rem;padding:1.4rem;border:1px solid #555}.note-action form,.note-action fieldset{min-width:0;margin:0;padding:0;border:0}.note-action label{display:block;font-size:1.05rem;line-height:1.5;font-weight:600;margin:0 0 .6rem}.note-action label:not(:first-child){margin-top:1.6rem}.note-action textarea{display:block;width:100%;min-width:0;min-height:5.1rem;margin:0;padding:.8rem;color:#fff;background:#080808;border:1px solid #888;border-radius:0;resize:vertical;white-space:pre-wrap;overflow-wrap:anywhere;font:400 1.0625rem/1.55 Arial,Helvetica,sans-serif}.note-copy .note-action-hint{font-size:.95rem;line-height:1.6;color:#bdbdbd;margin:0 0 .7rem}.note-action-buttons{display:flex;flex-wrap:wrap;gap:.7rem;margin-top:1.2rem}.note-action button{max-width:100%;min-height:48px;padding:.75rem .9rem;border:1px solid #888;border-radius:0;background:#000;color:#fff;font:400 1rem/1.45 Arial,Helvetica,sans-serif;overflow-wrap:anywhere;text-align:left}.note-action button.note-action-primary{background:#fff;color:#000;border-color:#fff}.note-action button:disabled{opacity:.5;cursor:default}.note-action :is(button,textarea):focus-visible{outline:2px solid #fff;outline-offset:4px}.note-action pre{white-space:pre-wrap;white-space:break-spaces;overflow-wrap:anywhere;unicode-bidi:plaintext;font:400 clamp(1.2rem,2.2vw,1.65rem)/1.6 Arial,Helvetica,sans-serif;border-block:1px solid #555;padding:1rem 0;margin:.4rem 0 1.4rem}.note-copy .note-action-label{font:400 .8rem/1.5 ui-monospace,monospace;color:#bdbdbd;margin:1rem 0 .3rem}.note-copy .note-action-title{font-size:1.45rem;font-weight:500;line-height:1.3}.note-action-title:focus{outline:2px solid #aaa;outline-offset:4px}.note-copy .note-action-privacy{font-size:.85rem;line-height:1.6;color:#bdbdbd;margin:1.1rem 0 0}.note-copy .note-action-status{font-size:.95rem;line-height:1.6;margin:1.1rem 0 0}.note-action-status:empty{display:none}.note-action-toggle{width:100%;margin:0 0 .5rem}.note-action [hidden]{display:none!important}
/* Keep long words and the article opening readable on narrow screens. */
.note-interactive .note-precheck{min-height:0;padding-block:2.1rem 2.7rem}.note-interactive .note-precheck-stage{padding-block:2.3rem}.note-interactive .note-question{padding-block:clamp(2.5rem,5vw,4rem)}.note-interactive .note-question h1{font-size:clamp(2.25rem,5.2vw,4.6rem);line-height:1.08;max-width:22ch;overflow-wrap:anywhere}.note-interactive .note-copy{min-width:0;overflow-wrap:anywhere}.note-interactive .note-check p,.note-interactive .note-chain{overflow-wrap:anywhere}.note-interactive .note-final-line{font-size:clamp(2.15rem,4.7vw,4rem);line-height:1.1;max-width:22ch;overflow-wrap:anywhere}.note-interactive .note-answer-question{font-size:1.3rem;line-height:1.4}.note-interactive .note-answer p{font-size:2rem;font-weight:500}
@media(max-width:500px){.note-action{padding:1rem}.note-action-buttons{flex-direction:column}.note-action-buttons button{width:100%}.note-interactive .note-question h1{font-size:clamp(2.1rem,8.4vw,2.8rem)}.note-interactive .note-precheck-stage{padding-block:1.7rem}}
@media print{.note-action form,.note-action button,.note-action-privacy,.note-action-status{display:none}.note-action pre,.note-action-title,.note-action-label{color:#000!important}.note-action{border-color:#aaa}}

/* The list is an entry point; long titles should not dominate it. */
.notes-index .notes-index-hero{padding:clamp(2.6rem,6vw,4.6rem) 0 clamp(2.5rem,5vw,4rem)}
.notes-index .notes-index-hero h1{font-size:clamp(3.3rem,8vw,6rem);line-height:1.04}
.notes-index .note-card h2{max-width:25ch;font-size:clamp(1.8rem,3.1vw,2.8rem);line-height:1.12;letter-spacing:-.035em;overflow-wrap:anywhere}
.notes-index .note-card{padding-block:2.1rem 2.5rem}
.notes-page .note-card-body,.notes-page .note-copy{min-width:0}
.notes-page .note-final-line,.notes-page .note-question h1{overflow-wrap:anywhere}
@media(max-width:500px){.notes-page .phrase-lock{white-space:normal;overflow-wrap:anywhere}.notes-index .notes-index-hero h1{font-size:clamp(3rem,14vw,4.5rem)}.notes-index .note-card h2{font-size:clamp(1.8rem,7.6vw,2.35rem)}.notes-index .note-card{gap:1rem}}