
    html:theme(dark) { var(text-color): #fff; var(back-color):#333; var(disbaled-color): #aaa; }
    html:theme(light) { var(text-color): #000; var(back-color):#eee; var(disbaled-color): #777;}
          
    html 
    { 
      var(accent-color): window-accent-color;
      color: color(text-color);
      background: color(back-color);
      font:system; 
      overflow:hidden;
    }

    @media ui-blurbehind {
      /* platform supports blurbehind */ 
      html {
        background:transparent;
      }
    }

    body { flow:horizontal; margin:0; }
   
    toolbar  
    {
      display:block;
      flow:vertical; 
      width:max-content; 
      padding:3dip; 
      height:*;
      background:transparent;
    }
    toolbar > button                   
    {
      background-position: 50% 50%; 
      background-repeat:no-repeat;
      background-size:20dip;
      //foreground-size:auto;
      padding:0;
      size:46dip; 
      fill: color(text-color);
      stroke:none;
    }

    toolbar > button:disabled { fill:color(disbaled-color); } 
    
    frame#content{ size:*; background: transparent ; }
    frame#content > div#intro
    { 
      font: system;
      background-color:window; padding:3px; 
      size:*;
    }
    frame#content > div#intro > img#arrow { vertical-align:middle; size:0.8em; color:brown; }
    
    frame#content.allow-drop
    {
        outline:2dip orange solid -2dip;
    }

    toolbar > button#open         { background-image:url(path:M 4 4 L 4 5 L 4 20 L 4 21 L 4 23.71875 L 6 21.71875 L 6 21 L 6 20 L 6 12 L 26 12 L 26 26 L 12 26 L 11 26 L 10.21875 26 L 8.21875 28 L 11 28 L 12 28 L 27 28 L 28 28 L 28 27 L 28 5 L 28 4 L 27 4 L 5 4 L 4 4 z M 6 6 L 26 6 L 26 10 L 6 10 L 6 6 z M 7 7 L 7 9 L 9 9 L 9 7 L 7 7 z M 10 7 L 10 9 L 12 9 L 12 7 L 10 7 z M 13 7 L 13 9 L 15 9 L 15 7 L 13 7 z M 7.96875 17 L 7.96875 19 L 11.53125 19 L 2.28125 28.25 L 3.71875 29.6875 L 12.96875 20.4375 L 12.96875 24 L 14.96875 24 L 14.96875 18 L 14.96875 17 L 13.96875 17 L 7.96875 17 z); }
    toolbar > button#open-in-view { background-image:url(path:M4,4v1v23h24V4H4z M6,6h20v4H6V6z M7,7v2h2V7H7z M10,7v2h2V7H10z M13,7v2h2V7H13z M6,12h20v14H6V12z); }
    toolbar > button#reload       { background-size:26dip; background-image:url(path:M 4.5 2 C 3.1250151 2 2 3.1250151 2 4.5 L 2 5.5 L 2 6 L 3 6 L 3 5.5 L 3 4.5 C 3 3.6649849 3.6649849 3 4.5 3 L 11.5 3 C 12.335015 3 13 3.6649849 13 4.5 L 13 6 L 11 6 L 13.5 8.5 L 16 6 L 14 6 L 14 4.5 C 14 3.1250151 12.874985 2 11.5 2 L 4.5 2 z M 2.5 7.5 L 0 10 L 2 10 L 2 11.5 C 2 12.874985 3.1250151 14 4.5 14 L 11.5 14 C 12.874985 14 14 12.874985 14 11.5 L 14 10.5 L 14 10 L 13 10 L 13 10.5 L 13 11.5 C 13 12.335015 12.335015 13 11.5 13 L 4.5 13 C 3.6649849 13 3 12.335015 3 11.5 L 3 10 L 5 10 L 2.5 7.5 z); }
    toolbar > button#help         { background-size:22dip; background-image:url(path:M 16 4 C 9.3844277 4 4 9.3844277 4 16 C 4 22.615572 9.3844277 28 16 28 C 22.615572 28 28 22.615572 28 16 C 28 9.3844277 22.615572 4 16 4 z M 16 6 C 21.534692 6 26 10.465308 26 16 C 26 21.534692 21.534692 26 16 26 C 10.465308 26 6 21.534692 6 16 C 6 10.465308 10.465308 6 16 6 z M 16 10 C 13.802666 10 12 11.802666 12 14 L 14 14 C 14 12.883334 14.883334 12 16 12 C 17.116666 12 18 12.883334 18 14 C 18 14.767423 17.508714 15.44544 16.78125 15.6875 L 16.375 15.8125 C 15.559939 16.083523 15 16.862393 15 17.71875 L 15 19 L 17 19 L 17 17.71875 L 17.40625 17.59375 C 18.944786 17.08181 20 15.620577 20 14 C 20 11.802666 18.197334 10 16 10 z M 15 20 L 15 22 L 17 22 L 17 20 L 15 20 z); }
    toolbar > button#inspector    { background-size:24dip; background-image:url(path:M 17.78125 0.1875 L 16.28125 0.8125 L 16.6875 2.6875 C 16.3125 2.9605 16.00575 3.3045 15.71875 3.6875 L 13.8125 3.25 L 13.1875 4.75 L 14.8125 5.78125 C 14.7395 6.25125 14.7445 6.7245 14.8125 7.1875 L 13.1875 8.21875 L 13.78125 9.71875 L 15.6875 9.3125 C 15.9625 9.6855 16.3045 9.99725 16.6875 10.28125 L 16.21875 12.1875 L 17.71875 12.8125 L 18.78125 11.15625 C 19.24825 11.22625 19.7315 11.22625 20.1875 11.15625 L 21.21875 12.8125 L 22.71875 12.21875 L 22.28125 10.3125 C 22.65125 10.0395 22.969 9.6895 23.25 9.3125 L 25.1875 9.75 L 25.8125 8.25 L 24.15625 7.21875 C 24.22825 6.75175 24.22225 6.30075 24.15625 5.84375 L 25.8125 4.78125 L 25.1875 3.28125 L 23.28125 3.71875 C 23.01025 3.34375 22.6925 3.00475 22.3125 2.71875 L 22.75 0.84375 L 21.25 0.21875 L 20.21875 1.84375 C 19.74875 1.76975 19.2715 1.77775 18.8125 1.84375 L 17.78125 0.1875 z M 19.5 4.25 C 19.794172 4.248875 20.08675 4.317 20.375 4.4375 C 21.528 4.9205 22.07575 6.221 21.59375 7.375 C 21.11175 8.528 19.779 9.07575 18.625 8.59375 C 17.473 8.11175 16.92425 6.781 17.40625 5.625 C 17.76775 4.761 18.617484 4.253375 19.5 4.25 z M 7.375 9.0625 L 6.96875 11.5625 C 6.36475 11.7095 5.79925 11.94 5.28125 12.25 L 3.21875 10.78125 L 1.71875 12.28125 L 3.15625 14.34375 C 2.84325 14.86475 2.61975 15.4555 2.46875 16.0625 L -0.03125 16.46875 L -0.03125 18.59375 L 2.46875 19.03125 C 2.61875 19.63725 2.84125 20.19775 3.15625 20.71875 L 1.6875 22.78125 L 3.1875 24.28125 L 5.28125 22.84375 C 5.80225 23.15675 6.36575 23.38325 6.96875 23.53125 L 7.375 26.03125 L 9.5 26.03125 L 9.9375 23.53125 C 10.5375 23.38025 11.11 23.1255 11.625 22.8125 L 13.71875 24.28125 L 15.21875 22.78125 L 13.71875 20.71875 C 14.02875 20.20175 14.25925 19.63125 14.40625 19.03125 L 16.9375 18.59375 L 16.9375 16.46875 L 14.40625 16.0625 C 14.25725 15.4645 14.02875 14.891 13.71875 14.375 L 15.1875 12.28125 L 13.6875 10.78125 L 11.625 12.28125 C 11.107 11.96825 10.5405 11.7115 9.9375 11.5625 L 9.5 9.0625 L 7.375 9.0625 z M 8.46875 14.59375 C 10.10375 14.59375 11.40625 15.89625 11.40625 17.53125 C 11.40625 19.16725 10.10375 20.5 8.46875 20.5 C 6.83275 20.5 5.5 19.16725 5.5 17.53125 C 5.5 15.89625 6.83275 14.59375 8.46875 14.59375 z); }

    toolbar > button#system-glass { background-size:24dip; margin-top:*; background-image:url(path:M 12.96875 3 C 12.637839 3.001211 12.306723 3.024264 11.96875 3.0625 C 7.9057576 3.521225 4.5800919 6.755393 4.0625 10.8125 C 3.6533962 14.022736 4.9567632 16.995065 7.1875 18.875 C 8.3310832 19.838985 9 21.25311 9 22.75 L 9 23 L 9 24 L 9 27 L 9 28 L 10 28 L 11.28125 28 C 11.627196 28.596897 12.260107 29 13 29 C 13.739893 29 14.372804 28.596897 14.71875 28 L 16 28 L 17 28 L 17 27 L 17 24 L 17 23 L 17 22.75 C 17 21.22361 17.736046 19.80257 18.9375 18.75 C 20.815975 17.103103 22 14.6907 22 12 C 22 7.0283812 17.932419 2.9818357 12.96875 3 z M 12.96875 5 C 16.87091 4.9808382 20 8.1122437 20 12 C 20 14.1033 19.088525 15.966897 17.625 17.25 C 16.245806 18.458285 15.406634 20.153367 15.1875 22 L 10.84375 22 C 10.645124 20.209322 9.8935567 18.51845 8.5 17.34375 C 6.7627368 15.879685 5.7396038 13.596264 6.0625 11.0625 C 6.4609081 7.939607 9.0584924 5.384525 12.1875 5.03125 C 12.453902 5.001111 12.708606 5.0012775 12.96875 5 z M 21.875 18.9375 L 21.875 20.78125 L 22.34375 20.78125 C 21.738662 21.166613 21.239611 21.681628 20.84375 22.28125 L 20.84375 21.9375 L 18.84375 21.9375 L 18.84375 23.8125 L 20.125 23.8125 C 20.030242 24.192801 20 24.591847 20 25 C 20 25.412354 20.060872 25.803474 20.15625 26.1875 L 18.84375 26.1875 L 18.84375 28.0625 L 20.84375 28.0625 L 20.84375 27.78125 C 21.230678 28.352623 21.761138 28.847702 22.34375 29.21875 L 21.875 29.21875 L 21.875 31.0625 L 23.875 31.0625 L 23.875 29.875 C 24.238486 29.959881 24.6117 30 25 30 C 25.3883 30 25.761514 29.959881 26.125 29.875 L 26.125 31.0625 L 28.125 31.0625 L 28.125 29.21875 L 27.65625 29.21875 C 28.261338 28.833387 28.760389 28.318372 29.15625 27.71875 L 29.15625 28.0625 L 31.15625 28.0625 L 31.15625 26.1875 L 29.875 26.1875 C 29.969758 25.807199 30 25.408153 30 25 C 30 24.587646 29.939128 24.196526 29.84375 23.8125 L 31.15625 23.8125 L 31.15625 21.9375 L 29.15625 21.9375 L 29.15625 22.21875 C 28.759567 21.632972 28.229376 21.157497 27.625 20.78125 L 28.125 20.78125 L 28.125 18.9375 L 26.125 18.9375 L 26.125 20.125 C 25.762294 20.040328 25.386169 20 25 20 C 24.6117 20 24.238486 20.040119 23.875 20.125 L 23.875 18.9375 L 21.875 18.9375 z M 25 22 C 26.668147 22 28 23.331853 28 25 C 28 26.668147 26.668147 28 25 28 C 23.331853 28 22 26.668147 22 25 C 22 23.331853 23.331853 22 25 22 z M 11 24 L 15 24 L 15 26 L 11 26 L 11 24 z); }    
    toolbar > button#glass        { background-size:24dip; margin-top:4dip; background-image:url(path:M 15 3 L 15 8 L 17 8 L 17 3 L 15 3 z M 7.5 6.09375 L 6.09375 7.5 L 9.625 11.0625 L 11.0625 9.625 L 7.5 6.09375 z M 24.5 6.09375 L 20.9375 9.625 L 22.375 11.0625 L 25.90625 7.5 L 24.5 6.09375 z M 16 9 C 12.145852 9 9 12.145852 9 16 C 9 19.854148 12.145852 23 16 23 C 19.854148 23 23 19.854148 23 16 C 23 12.145852 19.854148 9 16 9 z M 16 11 C 18.773268 11 21 13.226732 21 16 C 21 18.773268 18.773268 21 16 21 C 13.226732 21 11 18.773268 11 16 C 11 13.226732 13.226732 11 16 11 z M 3 15 L 3 17 L 8 17 L 8 15 L 3 15 z M 24 15 L 24 17 L 29 17 L 29 15 L 24 15 z M 9.625 20.9375 L 6.09375 24.5 L 7.5 25.90625 L 11.0625 22.375 L 9.625 20.9375 z M 22.375 20.9375 L 20.9375 22.375 L 24.5 25.90625 L 25.90625 24.5 L 22.375 20.9375 z M 15 24 L 15 29 L 17 29 L 17 24 L 15 24 z); }
   
    toolbar > button#live-reload  { 
      background-size:20dip; 
      background-image:url(path:M14.408 24h-13.408v-24h10.189c3.163 0 9.811 7.223 9.811 9.614v2.068c-.622-.296-1.293-.502-2-.603v-.623c0-4.106-6-2.456-6-2.456s1.518-6-2.638-6h-7.362v20h9.26c.566.81 1.299 1.49 2.148 2zm2.257-8.669c.402-.206.852-.331 1.335-.331 1.455 0 2.67 1.042 2.941 2.418l1.96-.398c-.456-2.291-2.475-4.02-4.901-4.02-.957 0-1.845.278-2.604.745l-1.396-1.745-1 5h5l-1.335-1.669zm5.335 8.669l-1.396-1.745c-.759.467-1.647.745-2.604.745-2.426 0-4.445-1.729-4.901-4.02l1.96-.398c.271 1.376 1.486 2.418 2.941 2.418.483 0 .933-.125 1.335-.331l-1.335-1.669h5l-1 5z); 
      transition: background-color 400ms linear, fill 400ms linear;
    }

    toolbar > button#live-reload:visited {
      background-color: color(text-color);
      fill: color(back-color);
    }

    hr { margin:0; padding:0; height:0; border:none; border-top: 1px dashed #999; }
