/* Keep the custom picker in its label's flow, rather than inheriting the old arrow positioning. */
.noise-channel-picker>.nocan-select{position:relative;inset:auto;pointer-events:auto;display:block;font-size:inherit;line-height:normal}

/* Settings and noise cancellation share a full-height workspace and fixed actions. */
dialog:is(.noise-dialog,.portal-settings-dialog){width:min(900px,calc(100% - 48px));max-width:900px;height:min(820px,calc(var(--nocan-visible-height,100dvh) - 40px));max-height:calc(var(--nocan-visible-height,100dvh) - 40px);padding:0;border:1px solid #e1e5e9;border-radius:16px;background:#fff;color:#202124;overflow:hidden;overscroll-behavior:contain;container-name:nocan-settings;container-type:size}
dialog:is(.noise-dialog,.portal-settings-dialog)[open]{display:flex;flex-direction:column}
.portal-settings-dialog::backdrop{background:#15281f65;backdrop-filter:blur(5px)}
:is(.noise-dialog,.portal-settings-dialog)>.dialog-heading{display:flex;align-items:center;gap:14px;flex:none;min-height:112px;margin:0;padding:0 24px;background:#fff url('/assets/branding/noise-cancelling-wave-transparent.webp') center calc(100% + 20px)/100% 72px no-repeat}
:is(.noise-dialog,.portal-settings-dialog)>.dialog-heading h2{flex:1;min-width:0;max-width:540px;margin:0;line-height:0}
:is(.noise-dialog,.portal-settings-dialog)>.dialog-heading .icon-button{position:static;display:grid;place-items:center;flex:none;width:44px;height:44px;margin-left:auto;padding:10px;border:0;border-radius:50%;background:#f2f3f5;color:#42464d}
:is(.noise-dialog,.portal-settings-dialog)>.dialog-heading .icon-button .icon{display:block;width:24px;height:24px}
:is(.noise-dialog,.portal-settings-dialog)>.dialog-heading .icon-button:hover{background:#e6e9ed;color:#202124}
:is(.noise-dialog,.portal-settings-dialog)>.dialog-heading .icon-button:focus-visible{outline:2px solid #00823c;outline-offset:3px}
.portal-settings-body{flex:1;min-height:0;display:flex;flex-direction:column;overflow:hidden}
.portal-settings-dialog .settings-sections{flex:none;gap:20px;min-height:48px;margin:0;padding:0 24px;border-bottom:1px solid #e2e6e9}
.portal-settings-dialog .settings-sections button{min-height:48px;font-size:15px;font-weight:650;color:#69736d}
.portal-settings-dialog .settings-sections button[aria-current=page]{color:#00823c;border-color:#00823c}
.portal-settings-dialog .settings-scroll{flex:1;min-height:0;padding:20px 24px;overflow:auto;overscroll-behavior:contain;scroll-padding:12px}
.portal-settings-dialog .settings-block-title{flex-wrap:wrap;gap:6px 12px}
.portal-settings-dialog .settings-block h3{font-size:20px;line-height:1.45;color:#202124}
.portal-settings-dialog .settings-filter-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.portal-settings-dialog .settings-filter-grid button{display:grid;grid-template-columns:minmax(0,1fr) auto 12px;align-items:center;gap:10px;min-width:0;min-height:52px;padding:12px;border:1px solid #e1e5e9;border-radius:6px;background:#fff;text-align:left}
.portal-settings-dialog .settings-filter-grid span{font-size:15px;line-height:22px;white-space:nowrap;color:#202124}
.portal-settings-dialog .settings-filter-grid small{font-size:12px;white-space:nowrap;color:#626970}
.portal-settings-dialog .settings-filter-grid b{font-size:18px;color:#77857b}
.portal-settings-dialog .portal-settings-footer{flex:none;display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:72px;padding:12px 24px;border-top:1px solid #e1e5e9;background:#fff}
.portal-settings-dialog .portal-settings-footer>span{font-size:12px;line-height:20px;color:#60656d}
.portal-settings-dialog .portal-settings-footer button{flex:none;min-width:88px;min-height:44px;padding:9px 18px;border:1px solid #00823c;border-radius:6px;background:#00823c;color:#fff;font-size:15px;font-weight:700}
.portal-settings-dialog .portal-settings-footer button.settings-secondary{background:#fff;border-color:#d9e2dc;color:#52665a}

@media(max-width:1023px){
 dialog:is(.noise-dialog,.portal-settings-dialog){inset:var(--nocan-top-space,8px) 0 auto;width:100%;max-width:none;height:calc(var(--nocan-visible-height,100dvh) - var(--nocan-top-space,8px));max-height:calc(var(--nocan-visible-height,100dvh) - var(--nocan-top-space,8px));margin:0;border:0;border-radius:0;padding:0}
 :is(.noise-dialog,.portal-settings-dialog)>.dialog-heading{min-height:88px;padding:0 16px;background-size:100% 54px;background-position:center calc(100% + 19px)}
 .noise-dialog .noise-context-row{min-height:52px;padding:0 16px 8px}
 .noise-dialog .noise-channel-picker{min-width:0}
 .noise-dialog .noise-channel-picker>.nocan-select{width:155px}
 .noise-dialog .noise-utility-row{padding:8px 16px;gap:8px;flex-wrap:wrap}
 .noise-dialog .noise-category-tabs{flex:0 0 48px;min-height:48px}
 .noise-dialog .noise-category-tabs button{min-height:44px}
 .noise-dialog .noise-layout,.noise-dialog .noise-panel-stack{min-height:0}
 .noise-dialog .noise-config-panel{max-height:none;padding:14px 16px;scroll-padding:12px}
 .noise-dialog .noise-settings-actions{min-height:64px;padding:10px 16px max(10px,env(safe-area-inset-bottom,0px))}
 .noise-dialog .noise-settings-actions .noise-done{min-height:44px}
 .noise-dialog .noise-keyword-entry input{min-width:0;font-size:16px}
 .noise-dialog .noise-keyword-entry button{min-height:44px;padding:8px 12px}
 .portal-settings-dialog .settings-sections{padding:0 16px}
 .portal-settings-dialog .settings-scroll{padding:16px}
 .portal-settings-dialog .portal-settings-footer{min-height:64px;padding:10px 16px max(10px,env(safe-area-inset-bottom,0px))}
 .portal-settings-dialog .settings-start{flex-wrap:wrap;gap:12px}
 .portal-settings-dialog .settings-start>.nocan-select{flex:1 0 100%;width:100%}
 .portal-settings-dialog .settings-start small{font-size:12px;line-height:1.6}
 .portal-settings-dialog .settings-filter-grid{grid-template-columns:1fr}
 .portal-settings-dialog .settings-naver-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;padding:12px 0}
 .portal-settings-dialog .settings-tab-link{grid-column:1/-1;min-width:0}
 .portal-settings-dialog .settings-tab-link strong{font-size:15px}
 .portal-settings-dialog .settings-tab-link small{font-size:12px}
 .portal-settings-dialog .settings-copy-link,.portal-settings-dialog .settings-add-tab{min-height:44px;font-size:13px}
 .portal-settings-dialog .settings-copy-link{text-align:left}
 dialog.life-detail-dialog{max-width:calc(100% - 16px);max-height:calc(var(--nocan-visible-height,100dvh) - var(--nocan-top-space,8px) - 16px);margin-top:calc(var(--nocan-top-space,8px) + 8px);overflow:auto}
 .life-detail-dialog>.dialog-heading{position:sticky;top:0;z-index:3;margin:0;padding:12px 16px;background:#fff}
 .life-detail-dialog .dialog-heading h2{min-width:0;font-size:18px;line-height:1.45;overflow-wrap:anywhere}
 .life-detail-dialog .dialog-heading .icon-button{flex:none;min-width:44px;min-height:44px}
 dialog:is(.original-dialog,.reader-image-dialog,.instagram-viewer){height:var(--nocan-visible-height,100dvh);max-height:var(--nocan-visible-height,100dvh)}
 dialog.feed-comments-dialog{max-height:calc(var(--nocan-visible-height,100dvh) - var(--nocan-top-space,8px) - 8px);height:min(720px,calc(var(--nocan-visible-height,100dvh)*.8))}
 .original-header{gap:8px;padding-left:12px;padding-right:12px}
 .original-identity{min-width:0}
 .original-actions{flex:none;gap:6px}
 .original-close{width:44px;height:44px}
 .original-external{min-height:44px;padding:0 8px}
 .reader-image-dialog .icon-button{width:44px;height:44px}
 .reader-toolbar .reader-back,.reader-toolbar .reader-copy:not(.nocan-save-button),.reader-options button{min-height:44px}
 .reader-toolbar .reader-back{min-width:44px}
 .portal-chips>button,.instagram-topics>button,.market-tabs>button,.collection-categories>button,.life-tool-tabs>button,.library-tabs>button{min-height:44px;display:inline-flex;align-items:center;justify-content:center}
 .market-tabs{flex-wrap:nowrap;white-space:nowrap;overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:none}
 .market-tabs>button{flex:none}
 .market-live-detail>header button{min-width:44px;min-height:44px}
 .life-page :is(input:not([type=checkbox]),textarea),.settings-tab-search input,.instagram-search-form input{font-size:16px}
 .life-page :is(input:not([type=checkbox]),.nocan-select-trigger),.life-search button,.life-tool-actions>button,.life-language-row>button,.life-location-top button,.life-location-search button{min-height:44px}
 .life-page textarea{min-height:150px}
 .nocan-select-option{min-height:44px}
 .portal-content-card .content-card,.portal-channel-heading>div:first-child{min-width:0}
}
@media(max-width:360px){
 .portal-feed-section{padding-left:12px;padding-right:12px}
 .reading-card .card-title{font-size:16px;line-height:1.55}
 .reading-card .card-image,.portal-trends .reading-card:has(.video-play) .card-image{width:72px;height:62px;flex-shrink:0}
 .portal-economy>.realtime-market{padding-left:12px!important;padding-right:12px!important}
 .realtime-market .market-live-grid,.realtime-market .market-live-grid.crypto-grid{grid-template-columns:minmax(0,1fr)!important}
 .realtime-market .market-live-grid .market-live-quote{min-height:110px;padding:12px 16px}
 .market-live-detail .market-detail-price{max-width:100%;font-size:26px;white-space:normal;overflow-wrap:anywhere}
 .life-form-grid{grid-template-columns:minmax(0,1fr)}
 .life-tool-actions{flex-wrap:wrap;gap:8px}
 .life-tool-actions>button{width:100%;justify-content:center}
 .life-language-row{grid-template-columns:minmax(0,1fr) 36px minmax(0,1fr);gap:6px}
 .life-language-row>button{width:36px}
 .life-language-row .nocan-select-trigger{min-width:0}
 .portal-settings-dialog .settings-filter-grid button{gap:8px;padding:11px}
 .portal-settings-dialog .portal-settings-footer>span{max-width:58%}
 .feed-comments-dialog .feed-comments-list{padding-left:14px;padding-right:14px}
}
@container nocan-settings (max-height:480px){
 :is(.noise-dialog,.portal-settings-dialog)>.dialog-heading{min-height:54px;height:54px;padding:5px 12px;background-image:none}
 :is(.noise-dialog,.portal-settings-dialog)>.dialog-heading .noise-brand-long{max-width:260px}
 .noise-dialog .noise-context-row{display:none}
 .noise-dialog .noise-utility-row{min-height:50px;padding:3px 12px;gap:6px;flex-wrap:nowrap}
 .noise-dialog .noise-live-summary{gap:4px;font-size:11px;white-space:nowrap}
 .noise-dialog .noise-baseline-label{display:none}
 .noise-dialog .noise-quick-actions{gap:4px}
 .noise-dialog .noise-quick-actions button{min-height:40px;padding:6px;font-size:11px}
 .noise-dialog .noise-category-tabs{flex-basis:44px;min-height:44px}
 .noise-dialog .noise-panel-heading{margin-bottom:8px}
 .noise-dialog .noise-panel-heading h3{font-size:15px;line-height:22px}
 .noise-dialog .noise-config-panel{padding:10px 12px}
 .noise-dialog .noise-settings-actions,.portal-settings-dialog .portal-settings-footer{min-height:56px;padding:6px 12px}
 .noise-dialog .noise-settings-actions .noise-done{min-width:76px;padding:0 16px}
 .portal-settings-dialog .settings-sections{min-height:44px;padding:0 12px}
 .portal-settings-dialog .settings-sections button{min-height:44px}
 .portal-settings-dialog .settings-scroll{padding:12px}
}
@media(max-width:1023px){
 .noise-channel-picker .nocan-select-trigger,.settings-start .nocan-select-trigger{min-height:44px}
 .life-compare-bar button,.life-checklist label{min-height:44px}
 .life-compare-bar [data-life=compare-clear]{min-width:44px}
 .life-tool-output{min-width:0;max-width:100%;overflow-wrap:anywhere}
 .original-header h2{max-width:100%;overflow:hidden;text-overflow:ellipsis}
}
@media(max-width:360px){.life-language-row{grid-template-columns:minmax(0,1fr) 44px minmax(0,1fr)}.life-language-row>button{width:44px}}
@media(max-width:1023px){
 .realtime-market .market-live-tabs{flex-wrap:nowrap;overflow-x:auto;overflow-y:hidden;overscroll-behavior-x:contain;scrollbar-width:none}
 .realtime-market .market-live-tabs button{flex:none;min-height:44px}
 .editorial-reader .reader-toolbar{top:calc(var(--nocan-top-space,0px) + 56px)}
}
@media(max-width:360px){.editorial-article,.news-detail-reader .editorial-article{padding-left:16px;padding-right:16px}}
@container nocan-settings (max-height:480px){.noise-dialog .noise-quick-actions button{min-height:44px}}
/* Mobile sheets fill the complete web viewport; device padding stays inside the header. */
@media(max-width:1023px){
 dialog:is(.noise-dialog,.portal-settings-dialog){inset:0;width:100%;height:var(--nocan-visible-height,100dvh);max-height:var(--nocan-visible-height,100dvh);margin:0;border:0;border-radius:0}
 :is(.noise-dialog,.portal-settings-dialog)>.dialog-heading{padding-top:max(8px,env(safe-area-inset-top,0px))}
 .portal-settings-dialog .settings-news-shortcut{flex-wrap:wrap}
 .portal-settings-dialog .settings-news-shortcut>span{white-space:nowrap}
 .portal-settings-dialog .settings-news-shortcut button{min-height:44px!important;white-space:nowrap}
}
.portal-settings-dialog .settings-service-grid{grid-template-columns:repeat(5,minmax(0,1fr))}
.portal-settings-dialog .settings-service{min-height:108px;gap:8px;padding:20px 8px 12px;border-radius:8px}
.portal-settings-dialog .settings-service-symbol{width:40px;height:40px;font-size:22px;border-radius:10px}
.portal-settings-dialog .settings-service strong{font-size:14px;line-height:20px;white-space:nowrap;word-break:keep-all}
.portal-settings-dialog .settings-block-title h3,.portal-settings-dialog .settings-block-title>span{white-space:nowrap}
@media(max-width:600px){.portal-settings-dialog .settings-service-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}}
@media(max-width:360px){
 .portal-settings-dialog .settings-service-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
 .portal-settings-dialog .settings-service{min-height:102px}
 .portal-settings-dialog .settings-block-title{gap:6px 10px}
 .portal-settings-dialog .settings-block-title h3{font-size:18px}
 .portal-settings-dialog .settings-start strong{white-space:nowrap}
}
@container nocan-settings (max-height:480px){
 :is(.noise-dialog,.portal-settings-dialog)>.dialog-heading{height:56px;min-height:56px;padding:6px 12px}
}
@media(max-width:1023px){
 html:has(dialog.portal-settings-dialog[open]),html:has(dialog.noise-dialog[open]){overflow:hidden}
 dialog:is(.noise-dialog,.portal-settings-dialog){left:0;right:auto;width:100vw;max-width:100vw}
}

/* A panned visual viewport has its own origin when the soft keyboard is open. */
@media(max-width:1023px){
 dialog:is(.noise-dialog,.portal-settings-dialog){top:var(--nocan-visual-top,0px);left:var(--nocan-visual-left,0px);width:var(--nocan-visible-width,100vw);max-width:var(--nocan-visible-width,100vw)}
 dialog:is(.noise-dialog,.portal-settings-dialog) :is(input,textarea){scroll-margin-block:16px}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}dialog{animation:none!important}}

/* Plain, compact settings; branding belongs to the portal and filter workspace. */
dialog.portal-settings-dialog{height:min(620px,calc(var(--nocan-visible-height,100dvh) - 40px));max-width:680px}
.portal-settings-dialog>.dialog-heading{min-height:68px;height:auto;padding:12px 24px;background:#fff;border-bottom:1px solid #edf0f2}
.portal-settings-dialog>.dialog-heading h2{font-size:22px;line-height:1.4;letter-spacing:-.6px}
.portal-settings-dialog .settings-sections{background:#fff;border-radius:0;gap:24px}
.portal-settings-dialog .settings-sections button{flex:0 0 auto;border-radius:0;border-bottom:2px solid transparent;background:none;box-shadow:none}
.portal-settings-dialog .settings-sections button[aria-current]{border-bottom-color:#00823c;background:none;box-shadow:none}
.portal-settings-dialog [hidden]{display:none!important}
.portal-settings-dialog .settings-tab-editor{border:0;padding-top:0}
.portal-settings-dialog .settings-service-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.portal-settings-dialog .settings-service{min-height:80px;padding:12px 4px 9px;gap:6px;border-radius:10px;background:#fff}
.portal-settings-dialog .settings-service-symbol{width:30px;height:30px;background:transparent;color:#319b62;border-radius:0}
.portal-settings-dialog .settings-service-symbol svg{width:27px;height:27px}
.portal-settings-dialog .settings-service strong{font-size:12px;line-height:18px}
.portal-settings-dialog .settings-block h3{font-size:17px;margin-top:0}
.portal-settings-dialog .settings-filter-grid button{border-radius:8px}
@media(max-width:600px){dialog.portal-settings-dialog{max-width:100vw;height:calc(var(--nocan-visible-height,100dvh) - var(--nocan-top-space,8px))}.portal-settings-dialog>.dialog-heading{min-height:64px;padding:10px 16px}.portal-settings-dialog .settings-service-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.portal-settings-dialog .settings-filter-grid{grid-template-columns:1fr}.portal-settings-dialog .settings-service strong{font-size:11px}}


/* Mobile settings always fill the visible screen, including tablet-width webviews. */
@media(max-width:1023px){dialog.portal-settings-dialog{inset:var(--nocan-visual-top,0px) auto auto var(--nocan-visual-left,0px);width:100vw;max-width:100vw;height:var(--nocan-visible-height,100dvh);max-height:var(--nocan-visible-height,100dvh);margin:0;border:0;border-radius:0}}

/* Naver home shortcut: clear purpose, familiar green action, concise device guidance. */
.portal-settings-dialog .settings-news-shortcut{display:flex;flex-direction:column;align-items:stretch;gap:16px;padding:20px;border:1px solid #dceee2;border-radius:14px;background:#f7fcf9;color:#202124}
.portal-settings-dialog .settings-naver-heading{display:flex;align-items:center;gap:12px}
.portal-settings-dialog .settings-naver-symbol{display:grid;place-items:center;flex:none;width:40px;height:40px;border-radius:10px;background:#03c75a;color:#fff;font-family:Arial,sans-serif;font-size:27px;line-height:1;font-weight:900}
.portal-settings-dialog .settings-naver-heading strong{font-size:16px;line-height:24px;font-weight:700;letter-spacing:-.4px}
.portal-settings-dialog .settings-naver-heading p{margin:3px 0 0;font-size:13px;line-height:20px;color:#68736c;word-break:keep-all}
.portal-settings-dialog .settings-news-shortcut .nv-openmain{width:100%}
.portal-settings-dialog .settings-news-shortcut .nv-openmain>button{display:flex!important;align-items:center!important;justify-content:center!important;gap:8px!important;width:100%!important;min-height:46px!important;padding:12px 16px!important;border:0!important;border-radius:8px!important;background:#03c75a!important;color:#fff!important;font-family:inherit!important;font-size:14px!important;line-height:22px!important;font-weight:700!important;cursor:pointer}
.portal-settings-dialog .settings-news-shortcut .nv-openmain>button:hover{background:#02b550!important}
.portal-settings-dialog .settings-naver-help{margin:-4px 0 0;font-size:11px;line-height:18px;color:#7b857e;text-align:center;word-break:keep-all}
@media(max-width:380px){.portal-settings-dialog .settings-news-shortcut{padding:16px;gap:14px}.portal-settings-dialog .settings-naver-heading strong{font-size:15px}.portal-settings-dialog .settings-naver-heading p{font-size:12px}}

/* Match both desktop workspaces while retaining mobile full-screen rules. */
@media(min-width:1024px){dialog:is(.noise-dialog,.portal-settings-dialog){width:min(900px,calc(100vw - 48px));max-width:900px;height:min(820px,calc(var(--nocan-visible-height,100dvh) - 40px));max-height:calc(var(--nocan-visible-height,100dvh) - 40px)}}

/* Naver's mobile SDK wraps its button; keep the same full-width action. */
.portal-settings-dialog .settings-news-shortcut .nv-openmain>div{display:block!important;width:100%!important}
.portal-settings-dialog .settings-news-shortcut .nv-openmain button{display:flex!important;align-items:center!important;justify-content:center!important;gap:8px!important;width:100%!important;height:auto!important;min-height:46px!important;padding:12px 16px!important;border:0!important;border-radius:8px!important;background:#03c75a!important;color:#fff!important;font-family:inherit!important;font-size:14px!important;line-height:22px!important;font-weight:700!important;cursor:pointer}
.portal-settings-dialog .settings-news-shortcut .nv-openmain button:hover{background:#02b550!important}
.portal-settings-dialog .settings-news-shortcut .nv-openmain button>span{position:static!important;padding:0!important;border:0!important;color:inherit!important;font:inherit!important;line-height:inherit!important;letter-spacing:inherit!important}
.portal-settings-dialog .settings-news-shortcut .nv-openmain button>span:has(i){display:none!important}


.portal-settings-dialog .settings-news-shortcut .nv-openmain>div button>span{display:none!important}
.portal-settings-dialog .settings-news-shortcut .nv-openmain>div button:after{content:"네이버 홈에 추가　＋";color:#fff;font:inherit}
