@charset "utf-8";
/* \c6f9  \ccb4 \d5d8 \d310  \2014  \c2a4 \b9c8 \d2b8 \d3f0  \d654 \ba74  (\d3ed  760px \c774 \d558 ). \c544 \b798  \ba54 \b274 : \c870 \ac74  \b7  \ac80 \c0c9 \c0ac \c9c4  \b7  \cd94 \cc9c \c0ac \c9c4  \b7  \b354 \bcf4 \ae30  */
.mnav,.mback,.msheet,.mzoom,.mbreak,.mreport{display:none}
@media (max-width: 760px) {
  html,body{height:100%;height:100dvh}
  :root{--mnavh:calc(58px + env(safe-area-inset-bottom, 0px))}
  body{overflow:hidden}
  /* \c704 : \c548 \b0b4  \c904  \b7  \c571  \ba38 \b9ac  */
  .demobar{padding:5px 12px;gap:6px;font-size:11.5px}
  .demobar span:not(.grow){display:none}
  .demobar .dbtn{padding:3px 8px;font-size:11.5px}
  header.top{flex-wrap:nowrap;gap:6px;padding:6px 10px;min-height:0}
  .brand{font-size:15px;gap:6px;min-width:0;flex:1;white-space:nowrap;overflow:hidden}
  .brand .logo{width:28px;height:28px}
  .brand .artq{display:none}
  .top .steps,.top .sep,.top .folder,.recentwrap,#btnReanalyze,#btnHelp{display:none!important}
  .top .btn.big{height:38px;padding:0 10px;font-size:16px}
  /* \ac00 \c6b4 \b370 : \d55c  \bc88 \c5d0  \d55c  \d654 \ba74  */
  .layout,.layout.noL,.layout.noR,.layout.noL.noR{display:block!important;position:relative;flex:1;min-height:0;overflow:hidden}
  .layout>.left,.layout>.center,.layout>.right{position:absolute;inset:0 0 var(--mnavh) 0;display:none!important;overflow-y:auto;visibility:visible!important;padding-bottom:12px}
  body.m-list .layout>.center,body.m-rec .layout>.center{display:flex!important;overflow-y:auto}
  body.m-list .setbar{display:none}
  body.m-rec .tabs,body.m-rec .gridwrap{display:none!important}
  /* \cd94 \cc9c \c0ac \c9c4  \d654 \ba74 : \b2e8 \cd94 \b294  \c904 \bc14 \afc8 , \c138 \d2b8 \b294  2\c5f4  */
  body.m-rec .setbar{border-bottom:0;padding:12px}
  #btnReport{display:none!important}
  body.m-rec .sethead{flex-wrap:wrap;overflow:visible;row-gap:8px}
  body.m-rec .sethead .btn{flex:1 1 calc(50% - 8px);justify-content:center}
  body.m-rec #setStrip{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;overflow:visible;min-height:0}
  body.m-rec #setStrip .empty{grid-column:1/-1}
  body.m-rec .scard{width:auto}body.m-rec .stile.slot{width:100%!important;aspect-ratio:4/3}body.m-rec .scard .stile{width:100%;height:auto;aspect-ratio:4/3}body.m-rec .scard .role,body.m-rec .scard .nm{max-width:100%}
  body.m-cond .layout>.left{display:block!important;padding:12px 14px 16px!important;border:0}
  /* \bcf4 \ace0 \c11c  \d654 \ba74  */
  body.m-report .layout>.mreport{display:flex;flex-direction:column;position:absolute;inset:0 0 var(--mnavh) 0;background:var(--bg)}
  .mrbar{display:flex;align-items:center;gap:8px;padding:8px 12px;border-bottom:1px solid var(--line);font-size:13px}
  .mrbar .muted{font-size:11.5px}
  .mrbar .mpz{margin:0;padding:1px 3px}
  .mrbar .mpz .fit{font-size:14px}
  .mpdf{flex:1;overflow:auto;-webkit-overflow-scrolling:touch;background:#5b5b60;touch-action:pan-x pan-y;overscroll-behavior:contain}
  .mpages{margin:0 auto;padding:8px;box-sizing:content-box}
  .mpage{display:block;background:#fff;margin:0 0 8px;box-shadow:0 2px 10px rgba(0,0,0,.35)}
  .mpmsg{color:#eee;text-align:center;padding:40px 16px;font-size:13px}
  /* \c0c1 \c138  \b0b4 \c6a9 : \baa8 \b2ec  \cc3d  (\c544 \b798 \c5d0 \c11c  \c62c \b77c \c634 ) */
  body.m-modal .layout>.right{display:flex!important;position:fixed;inset:6dvh 0 0 0;z-index:60;padding:0 14px calc(16px + env(safe-area-inset-bottom, 0px))!important;border:0;border-radius:16px 16px 0 0;background:var(--panel);box-shadow:0 -10px 40px rgba(0,0,0,.5);overscroll-behavior:contain;animation:mup .18s ease-out}
  @keyframes mup{from{transform:translateY(24px);opacity:.4}to{transform:none;opacity:1}}
  body.m-modal .right .rtools,body.m-modal #rpehName,body.m-modal #appFoot{display:none!important}
  .mdim{display:none}
  body.m-modal .mdim{display:block;position:fixed;inset:0;z-index:59;background:rgba(0,0,0,.55)}
  body.m-modal{overflow:hidden}
  .rail,.fold{display:none!important}
  .center{flex-direction:column}
  .gridwrap{flex:none;display:block}
  .grid{overflow:visible;flex:none;padding:10px}
  .tree{width:auto;border-right:0;border-bottom:1px solid var(--line);max-height:220px}
  /* \cd94 \cc9c  \c138 \d2b8  \c904 : \bc84 \d2bc \c740  \c606 \c73c \b85c  \bc00 \c5b4  \bcf4 \ae30  */
  .setbar{padding:8px 10px}
  .sethead{flex-wrap:nowrap;overflow-x:auto;-webkit-overflow-scrolling:touch;padding-bottom:4px;scrollbar-width:none}
  .sethead::-webkit-scrollbar{display:none}
  .sethead>*{flex:0 0 auto}
  .sethead .grow{display:none}
  .scard{width:118px;flex-basis:118px}.scard .stile{width:118px;height:80px}.scard .role,.scard .nm{max-width:118px}
  .reason.why2{font-size:12px}
  .tabs{flex-wrap:wrap;gap:6px;padding:8px 10px}
  .tabs .grow,.zoomctl,#btnCompare{display:none!important}
  .mbreak{display:block;flex-basis:100%;height:0;order:4}
  .search{flex:1 1 0;min-width:0;width:auto;order:5}
  .mzoom{display:flex;align-items:center;gap:2px;flex:0 0 auto;order:6;border:1px solid var(--line);border-radius:9px;padding:2px 4px}
  .mzoom button{background:none;border:0;color:var(--text);font-size:16px;line-height:1;width:26px;height:26px;border-radius:6px;cursor:pointer}
  .mzoom button:active{background:var(--panel2)}
  .mzoom input{width:70px;accent-color:var(--accent)}
  .mzoom .mzv{min-width:38px;text-align:right;font-size:12px;color:var(--accent2)}
  .grid{--mgap:8px;gap:var(--mgap);grid-template-columns:repeat(auto-fill,calc((100% + var(--mgap)) * var(--mpct, 50) / 100 - var(--mgap)))!important;justify-content:start}
  body.m-tiny .grid{--mgap:5px;padding:8px}
  body.m-tiny .tile .info{font-size:10px}
  body.m-tiny .tile .info .nm,body.m-tiny .tile .info input{display:none}
  /* \c0ac \c9c4  \ce78 : \b9c8 \c6b0 \c2a4  \c62c \b9bc  \b2e8 \cd94  \b300 \c2e0  \c0c1 \c138  \d654 \ba74 \c5d0 \c11c  */
  .tile .acts{display:none}
  .tile .info{font-size:11px}
  /* \c0c1 \c138  \d654 \ba74  \c704  '\2190  \c0ac \c9c4  \baa9 \b85d ' */
  .mback{display:flex;align-items:center;justify-content:center;position:sticky;top:0;z-index:2;align-self:flex-end;width:34px;height:34px;margin:10px -4px 4px 0;flex:0 0 auto;background:var(--panel2);border:1px solid var(--line);color:var(--text);border-radius:50%;font-size:15px;cursor:pointer}
  .dimg img{max-height:46vh}
  .appfoot{position:static;margin:14px 0 0}
  /* \c544 \b798  \d0ed  \b9c9 \b300  */
  .status{display:none}
  .mnav{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:40;height:var(--mnavh);box-sizing:border-box;border-top:1px solid var(--line);background:var(--panel);padding:4px 4px calc(4px + env(safe-area-inset-bottom, 0px));box-shadow:0 -4px 14px rgba(0,0,0,.25)}
  .mnav button{flex:1;display:flex;flex-direction:column;align-items:center;gap:2px;background:none;border:0;color:var(--muted);font-size:11px;padding:6px 0;border-radius:10px;cursor:pointer;position:relative}
  .mnav button .mi{font-size:20px;line-height:1}
  .mnav button.on{color:var(--accent2);background:color-mix(in srgb,var(--accent) 14%,var(--panel))}
  .mnav .mb{position:absolute;top:2px;right:calc(50% - 26px);background:var(--accent);color:var(--onaccent);font-size:9.5px;font-weight:800;border-radius:8px;min-width:16px;padding:0 4px}
  .mnav .mb:empty{display:none}
  /* \ba54 \b274  \c2dc \d2b8  */
  .msheet[open]{display:block;position:fixed;inset:auto 0 0 0;margin:0;width:100%;max-width:100%;border-radius:16px 16px 0 0;padding:14px 14px calc(14px + env(safe-area-inset-bottom, 0px))}
  .msheet h2{font-size:15px;margin:0 0 10px}
  .msheet .mg{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
  .msheet .mg button{display:flex;flex-direction:column;align-items:center;gap:4px;padding:12px 4px;background:var(--panel2);border:1px solid var(--line);border-radius:12px;color:var(--text);font-size:12px;cursor:pointer}
  .msheet .mg button .mi{font-size:22px}
  .msheet .mclose{width:100%;margin-top:10px}
  /* \cc3d : \d3f0  \d3ed \c5d0  \b9de \cda4  */
  dialog{max-width:96vw}
  dialog.settings,dialog.findbox,dialog.helpbox,dialog.introbox,dialog.cfbox,dialog.resetbox,dialog.pastebox,dialog.errbox{width:96vw;padding:14px}
  dialog.helpbox{height:90vh;padding:0}
  .helpbox .hhead{flex-wrap:wrap;gap:8px;padding:10px 12px}
  .helpbox .hhead input{max-width:none;flex:1 1 100%;order:3;margin:0}
  .helpbox .hbody{flex-direction:column}
  #helpNav{display:flex!important;width:auto;overflow-x:auto;border-right:0;border-bottom:1px solid var(--line);padding:6px;gap:4px;flex:0 0 auto}
  #helpNav a{white-space:nowrap;padding:5px 9px;font-size:12.5px}
  #helpBody{padding:4px 14px 24px}
  .hs .row{flex-direction:column}
  .cards{grid-template-columns:1fr}
  .themes{gap:6px}
  #introBody{padding:18px 16px 12px}
  .ihero{flex-direction:column;text-align:center;gap:10px}
  .ilogo{width:72px;height:72px}
  .iname{font-size:26px}
  .ifeat{grid-template-columns:1fr}
  .frow{grid-template-columns:1fr auto;row-gap:4px}
  .frow .fd{grid-column:1/-1}
  dialog.full{width:100vw;height:100%;max-width:100vw;max-height:100%;border-radius:0}
  .wallhead{flex-wrap:wrap;gap:8px;padding:8px 10px}
  .wallhead .muted{display:none}
  .wall{flex-wrap:wrap;align-content:center;gap:12px;padding:16px}
  .compare{grid-template-columns:1fr!important}
  .toast{max-width:92vw;bottom:84px}
  .indicator::before{width:260px}
}