/* A quiet paper note within the existing dialog, with no second overlay. */
#portfolio-dialog[data-view="note"]{width:min(530px,calc(100% - 32px));padding:0;border:1px solid #f4ead3a8;border-radius:16px;background:#f0e7d1}
#portfolio-dialog[data-view="note"] .access-panel{border:0;border-radius:15px;padding:28px 34px 24px;background:linear-gradient(115deg,#f6eedb,#eee3cb);box-shadow:none}
#portfolio-dialog[data-view="note"] .access-panel:before{opacity:.1}
#portfolio-dialog[data-view="note"] .access-masthead{padding-bottom:24px;border-bottom:1px solid #77623c40}
#portfolio-dialog[data-view="note"] .access-brand-lockup{width:165px}
#portfolio-dialog[data-view="note"] .dialog-close{top:26px;right:25px}
.note-sheet[hidden],.note-sheet [hidden],.access-view[hidden]{display:none!important}
.note-sheet{position:relative;animation:note-arrive .35s cubic-bezier(.2,1,.3,1) both}
#portfolio-dialog .note-sheet h2{margin:26px 0 12px;font-size:48px;line-height:.98;font-weight:500;letter-spacing:-.055em;max-width:15ch}
#portfolio-dialog .note-sheet h2 br{display:initial}
.note-sheet p{margin:0;font-size:16px;line-height:1.5;color:#635341;letter-spacing:-.01em}
.note-back{display:inline-flex;align-items:center;gap:7px;min-height:40px;margin:12px 0 -9px;padding:0;background:none;border:0;color:#6e5b45;font:inherit;font-size:13px;cursor:pointer}
.note-back svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.3}
.note-back:hover{color:var(--panel-red)}
#contact-note-form{margin-top:24px}
.note-fields{display:grid;grid-template-columns:1fr 1.15fr;gap:19px 22px}
.note-field{display:flex;flex-direction:column;min-width:0;gap:7px;font-size:14px;font-weight:500;line-height:1.3}
.note-field input,.note-field textarea{display:block;width:100%;min-width:0;min-height:44px;margin:0;padding:9px 1px;border:0;border-bottom:1px solid #806b4d80;border-radius:0;background:transparent;box-shadow:none;color:var(--panel-ink);font:inherit;font-size:18px;font-weight:400;line-height:1.5;caret-color:var(--panel-red);outline:none;transition:border-color .2s,box-shadow .2s}
.note-field textarea{resize:vertical;min-height:100px;max-height:260px}
.note-field input:focus,.note-field textarea:focus{border-color:var(--panel-red);box-shadow:0 1px 0 var(--panel-red)}
.note-field textarea::placeholder{color:#897760;font-size:16px;opacity:1}
.note-field [aria-invalid="true"]{border-color:var(--panel-red)}
.note-field .note-error{font-size:12px;line-height:1.4;color:#9e3025;font-weight:400}
.note-error:empty{display:none}
.note-message{grid-column:1/-1}
.note-trap{position:absolute;left:-10000px;top:auto;width:1px;height:1px;overflow:hidden}
.note-sheet .note-feedback{font-size:14px;color:#9e3025;margin:14px 0 0}
.note-feedback:empty{display:none}
.note-send{display:flex;align-items:center;justify-content:space-between;gap:20px;width:100%;min-height:52px;margin:24px 0 0;padding:13px 18px;border:1px solid #8e2b21;border-radius:7px;background:var(--panel-red);color:#fff4da;box-shadow:0 2px 0 #70261e;font:inherit;font-size:19px;font-weight:500;letter-spacing:-.025em;cursor:pointer;transition:background .2s,box-shadow .2s}
.note-send svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round;transition:transform .4s cubic-bezier(.2,1,.3,1)}
.note-send:hover{background:#932d22;box-shadow:0 2px 0 #70261e,0 4px 15px #9b34232b}
.note-send:hover svg,.note-send:focus-visible svg{transform:translate(3px,-3px) rotate(8deg)}
.note-send[aria-disabled="true"]{cursor:wait;opacity:.72}
.note-footer{display:flex;justify-content:center;flex-wrap:wrap;gap:5px;margin-top:22px;font-size:13px;line-height:1.7;color:#6e5b45}
.note-footer a{color:var(--panel-ink);text-decoration-color:#806b4d80;text-underline-offset:4px}
.note-footer a:hover{text-decoration-color:var(--panel-red)}
.note-received{padding:30px 0 10px;outline:none;animation:note-arrive .4s ease both}
.note-check{width:44px;height:44px;fill:none;stroke:var(--panel-red);stroke-width:1.3;stroke-linecap:round;stroke-linejoin:round}
.note-done{display:flex;align-items:center;justify-content:space-between;width:100%;min-height:48px;margin-top:25px;padding:12px 0;border:0;border-bottom:1px solid #806b4d80;background:none;color:var(--panel-ink);font:inherit;font-size:17px;cursor:pointer}
.note-done:hover{color:var(--panel-red)}
@keyframes note-arrive{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:none}}
@media(max-width:600px),(max-width:960px) and (pointer:coarse){
 #portfolio-dialog[data-view="note"]{width:min(450px,calc(100% - 24px));border-radius:14px}
 #portfolio-dialog[data-view="note"] .access-panel{padding:17px 22px 20px;border-radius:13px}
 #portfolio-dialog[data-view="note"] .access-masthead{padding-bottom:16px}
 #portfolio-dialog[data-view="note"] .access-brand-lockup{width:130px}
 #portfolio-dialog[data-view="note"] .dialog-close{top:12px;right:12px}
 #portfolio-dialog .note-sheet h2{font-size:36px;margin:23px 0 10px}
 .note-sheet p{font-size:15px}
 #contact-note-form{margin-top:20px}
 .note-fields{grid-template-columns:1fr;gap:16px}
 .note-field{gap:3px}
 .note-field input,.note-field textarea{font-size:17px}
 .note-field textarea{min-height:82px}
 .note-send{margin-top:21px;min-height:50px;font-size:18px}
 .note-footer{margin-top:18px;font-size:12px}
 #portfolio-dialog[data-view="note"][data-compact-viewport] .access-panel{padding:10px 18px 16px}
 #portfolio-dialog[data-view="note"][data-compact-viewport] .access-masthead{padding-bottom:8px}
 #portfolio-dialog[data-view="note"][data-compact-viewport] .access-brand-lockup{width:100px}
 #portfolio-dialog[data-view="note"][data-compact-viewport] .dialog-close{top:5px;right:9px}
 #portfolio-dialog[data-view="note"][data-compact-viewport] h2{font-size:28px;margin-top:15px}
 #portfolio-dialog[data-view="note"][data-compact-viewport] .note-fields{gap:12px}
}
@media(prefers-reduced-motion:reduce){.note-sheet,.note-received{animation:none}}