.architecture-notes-trigger::before{content:'';display:block;inline-size:11px;block-size:14px;flex:0 0 auto;border:1px solid currentColor;background:repeating-linear-gradient(to bottom,transparent 0 3px,currentColor 3px 4px,transparent 4px 6px);background-clip:content-box;padding:2px;clip-path:polygon(0 0,70% 0,100% 25%,100% 100%,0 100%)}
.architecture-notes-trigger{gap:9px!important}
.architecture-notes-dialog{inline-size:min(880px,calc(100% - 24px));max-inline-size:880px;max-block-size:calc(100dvh - 36px);padding:0;border:0;border-radius:0;background:#f1e1b9;color:#35291b;line-height:1.7;box-shadow:0 24px 100px #000b;clip-path:polygon(0 8px,8px 8px,8px 0,calc(100% - 16px) 0,calc(100% - 16px) 5px,100% 5px,100% calc(100% - 10px),calc(100% - 7px) calc(100% - 10px),calc(100% - 7px) 100%,16px 100%,16px calc(100% - 5px),0 calc(100% - 5px));scrollbar-color:#9b8258 #e8d6aa;overscroll-behavior:contain}
.architecture-notes-dialog::backdrop{background:#070c08d9;backdrop-filter:blur(5px)}
.architecture-notes-paper{padding:0 38px 30px;background:linear-gradient(90deg,#b5986424,transparent 18px,transparent calc(100% - 18px),#b5986424),radial-gradient(#78613c14 .65px,transparent .8px);background-size:auto,9px 9px}
.architecture-notes-header{position:sticky;inset-block-start:0;z-index:1;padding-block:25px 17px;border-block-end:2px solid #9f8552;background:#f1e1b9}
.architecture-notes-dialog .architecture-notes-eyebrow{margin:0 0 10px;color:#735c35;font:10px Consolas,'Courier New',monospace;letter-spacing:1px}
.architecture-notes-title-row{display:flex;align-items:flex-start;justify-content:space-between;gap:20px}
.architecture-notes-dialog h2{margin:0;color:#35291b;font:600 28px/1.2 Georgia,serif;letter-spacing:-.5px;max-inline-size:550px}
.architecture-notes-dialog .architecture-notes-close{flex:0 0 auto;max-inline-size:150px;border:1px solid #8a7147;border-radius:0;background:#e2cd9a;color:#3f301d;padding:8px 11px;font:11px/1.4 Consolas,monospace;min-block-size:40px;cursor:pointer}
.architecture-notes-dialog .architecture-notes-close:hover{background:#d4bd87}
.architecture-notes-dialog :is(button,select,a,[tabindex]):focus-visible{outline:2px solid #3e5a32;outline-offset:4px}
.architecture-notes-dialog p{color:#443723;font-size:14px;line-height:1.8;margin:0 0 18px}
.architecture-notes-dialog .architecture-notes-intro{margin-block:24px 20px;padding-inline-start:14px;border-inline-start:3px solid #7e8b4d;font-size:14px}
.architecture-notes-chooser{display:flex;align-items:center;gap:14px;flex-wrap:wrap;padding-block:14px;border-block:1px dashed #9b8257;font:12px Consolas,monospace;margin-block-end:25px}
.architecture-notes-dialog select{background:#f8edcf;color:#382d1e;border:1px solid #9b8257;border-radius:0;padding:9px 12px;font-size:14px;min-inline-size:215px;max-inline-size:100%;min-block-size:42px}
.architecture-notes-dialog .architecture-notes-index{font:11px Consolas,monospace;color:#77592e;letter-spacing:.7px;margin-block-end:12px}
.architecture-notes-dialog h3{font:600 26px/1.25 Georgia,serif;letter-spacing:-.25px;color:#3e301c;margin:0 0 17px;max-inline-size:650px}
.architecture-notes-dialog h4{font:600 15px/1.5 Consolas,monospace;letter-spacing:0;color:#4c3b21;margin:28px 0 14px}
.architecture-notes-dialog .architecture-notes-summary{font-size:15px;color:#43351f}
.architecture-notes-table-wrap{max-inline-size:100%;overflow-x:auto;margin-block-end:25px;border:1px solid #ab946b;background:#faefd24d}
.architecture-notes-dialog table{inline-size:100%;border-collapse:collapse;min-inline-size:530px;font-size:13px;line-height:1.65;color:#3e321f}
.architecture-notes-dialog th,.architecture-notes-dialog td{padding:12px 13px;text-align:start;vertical-align:top;border-inline-end:1px solid #ad96704d;border-block-end:1px solid #ad967080}
.architecture-notes-dialog thead th{background:#d8c18c;color:#392b18;font:600 11px/1.5 Consolas,monospace}
.architecture-notes-dialog tbody th{font-weight:600;inline-size:24%}
.architecture-notes-dialog tbody tr:last-child :is(th,td){border-block-end:0}
.architecture-notes-challenges{margin:0;padding-inline-start:27px;counter-reset:field-step}
.architecture-notes-challenges li{padding-inline-start:7px;margin-block-end:18px;color:#49391f}
.architecture-notes-challenges li::marker{font-family:Consolas,monospace;color:#705525;font-weight:600}
.architecture-notes-challenges strong{font-size:14px;font-weight:650}
.architecture-notes-challenges p{margin-block:5px 0}
.architecture-notes-sources{margin-block-start:25px;padding-block-start:2px;border-block-start:1px dashed #9b8257}
.architecture-notes-sources a{display:block;color:#37542d;text-decoration:underline;text-underline-offset:3px;font-size:13px;padding-block:5px;overflow-wrap:anywhere}
.architecture-notes-dialog .architecture-notes-footer{margin:25px 0 0;padding-block-start:17px;border-block-start:2px solid #9f8552;font:11px/1.8 Consolas,monospace;color:#6c5530}
.architecture-notes-dialog[lang=ar]{font-family:'Segoe UI',Tahoma,Arial,sans-serif}
.architecture-notes-dialog[lang=ar] :is(h2,h3,h4){font-family:'Segoe UI',Tahoma,Arial,sans-serif;letter-spacing:0;line-height:1.55}
.architecture-notes-dialog[lang=ar] p{line-height:1.95}
@media(max-width:620px){.architecture-notes-dialog{max-block-size:calc(100dvh - 20px);inline-size:calc(100% - 16px)}.architecture-notes-paper{padding-inline:19px;padding-block-end:23px}.architecture-notes-header{padding-block:19px 13px}.architecture-notes-title-row{gap:10px}.architecture-notes-dialog h2{font-size:23px}.architecture-notes-dialog h3{font-size:23px}.architecture-notes-dialog .architecture-notes-close{font-size:10px;padding:7px;max-inline-size:92px}.architecture-notes-dialog .architecture-notes-eyebrow{font-size:8px;letter-spacing:.6px}.architecture-notes-dialog p{font-size:13px}.architecture-notes-dialog .architecture-notes-summary{font-size:14px}.architecture-notes-dialog select{min-inline-size:0;inline-size:100%;font-size:16px}.architecture-notes-chooser{gap:8px}.architecture-notes-dialog .architecture-notes-footer{font-size:10px}}
@media(prefers-reduced-motion:reduce){.architecture-notes-dialog,.architecture-notes-dialog *{scroll-behavior:auto;animation:none!important;transition:none!important}}
