.notepad-desktop-icon{position:relative;width:48px;height:48px;filter:drop-shadow(1px 2px 1px #19354d70)}
.notepad-desktop-icon img{display:block}
.notepad-window{width:min(620px,calc(100% - 40px));height:min(440px,calc(100% - 30px));left:50%;top:48%;z-index:8;font-size:12px}
.notepad-caption-icon{object-fit:contain;flex:none}

.np-area{position:relative;display:flex;flex:1;min-height:0;margin:0 1px}
.np-text{flex:1;min-width:0;margin:0;padding:2px 4px;border:1px solid;border-color:#7f9db9;resize:none;outline:none;background:#fff;color:#000;font:13px "Lucida Console",monospace;line-height:1.3;white-space:pre;overflow:scroll;tab-size:8}
.np-text.is-wrapped{white-space:pre-wrap;overflow-wrap:break-word;overflow-x:hidden}
.np-statusbar{gap:0;padding-right:16px}
.np-statusbar>span:first-child{flex:1}
.np-statusbar>#np-position{flex:none;min-width:130px;padding:0 6px;border-left:1px solid #c0bdaf}
.np-prewrap{white-space:pre-line}
.np-hint{margin:0;color:#555}

/* Find / Replace: a small box that floats over the text without blocking it */
.np-find{position:absolute;top:24px;left:auto;right:16px;margin:0;z-index:5;min-width:0;width:min(400px,calc(100% - 24px))}
.np-find-body{display:flex;gap:10px;padding:10px 12px 12px}
.np-find-fields{display:grid;gap:7px;flex:1;min-width:0}
.np-find-fields>label{display:grid;grid-template-columns:78px 1fr;align-items:center}
.np-find-fields input[type="text"]{min-width:0;padding:2px 4px;border:1px solid #7f9db9;font:inherit}
.np-find-options{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap}
.np-find-options fieldset{display:flex;gap:8px;margin:0;padding:2px 8px 4px;border:1px solid #d0d0bf;border-radius:3px}
.np-find-buttons{display:grid;align-content:start;gap:5px}
.np-find:not(.is-replace) .np-replace-only{display:none}
.np-find.is-replace .np-find-only{display:none}

/* Font dialog */
.np-font-body{grid-template-columns:1.6fr 1fr .7fr;gap:10px}
.np-font-body label{display:grid;gap:3px}
.np-font-body select{min-width:0;border:1px solid #7f9db9;font:12px Tahoma,sans-serif}
.np-font-sample-box{grid-column:1/-1;margin:0;padding:6px 10px;border:1px solid #d0d0bf;border-radius:3px}
.np-font-sample-box legend{color:#0046d5;padding:0 3px}
#np-font-sample{height:48px;display:grid;place-items:center;overflow:hidden;white-space:nowrap}

@media(max-width:600px){
  .notepad-window{left:50%;top:55%;width:calc(100% - 16px);height:calc(100% - 126px);min-height:300px}
  .np-find-body{flex-direction:column}
  .np-find-buttons{grid-template-columns:repeat(2,1fr)}
  .np-font-body{grid-template-columns:1fr 1fr}
  .np-font-body label:first-child{grid-column:1/-1}
}
@media(max-height:510px){
  .notepad-window{top:50%;height:calc(100% - 16px)}
}